source

Angular에서 배열 내의 객체를 검색해야 합니다.

lovecheck 2023. 3. 28. 21:53
반응형

Angular에서 배열 내의 객체를 검색해야 합니다.

Angular에는 많은 객체를 반환하는 객체가 스코프에 있습니다.각각 ID가 있습니다(이것은 플랫파일에 저장되어 있기 때문에 DB가 없고, 사용자가 사용할 수 없는 것 같습니다).ng-resource)

내 컨트롤러:

$scope.fish = [
    {category:'freshwater', id:'1', name: 'trout', more:'false'},
    {category:'freshwater', id:'2', name:'bass', more:'false'}
];

내 보기에서는 기본적으로 숨긴 물고기에 대한 추가 정보가 있습니다.ng-show추가, 단, 심플한 show more 탭을 클릭했을 때 함수를 호출하고 싶습니다.showdetails(fish.fish_id)기능은 다음과 같습니다.

$scope.showdetails = function(fish_id) {  
    var fish = $scope.fish.get({id: fish_id});
    fish.more = true;
}

이제 뷰에 더 자세한 정보가 표시됩니다.그러나 문서를 검색해도 검색 방법을 찾을 수 없습니다.fish어레이를 설정합니다.

어레이를 문의하려면 어떻게 해야 하나요?콘솔에서는 디버거를 어떻게 호출하면$scope가지고 놀 물건?

기존 $filter 서비스를 사용할 수 있습니다.http://jsfiddle.net/gbW8Z/12/ 위의 바이올린을 업데이트했습니다.

 $scope.showdetails = function(fish_id) {
     var found = $filter('filter')($scope.fish, {id: fish_id}, true);
     if (found.length) {
         $scope.selected = JSON.stringify(found[0]);
     } else {
         $scope.selected = 'Not found';
     }
 }

각도에 관한 문서는, http://docs.angularjs.org/api/ng.filter:filter 를 참조해 주세요.

그게 조금이라도 도움이 될 수 있을 거야

여러분들을 위해 시뮬레이션을 해봤습니다.

jsFiddle을 체크합니다.)

http://jsfiddle.net/migontech/gbW8Z/5/

'ng-repeat'에서도 사용할 수 있는 필터를 만들었습니다.

app.filter('getById', function() {
  return function(input, id) {
    var i=0, len=input.length;
    for (; i<len; i++) {
      if (+input[i].id == +id) {
        return input[i];
      }
    }
    return null;
  }
});

컨트롤러에서의 사용:

app.controller('SomeController', ['$scope', '$filter', function($scope, $filter) {
     $scope.fish = [{category:'freshwater', id:'1', name: 'trout', more:'false'},  {category:'freshwater', id:'2', name:'bass', more:'false'}]

     $scope.showdetails = function(fish_id){
         var found = $filter('getById')($scope.fish, fish_id);
         console.log(found);
         $scope.selected = JSON.stringify(found);
     }
}]);

질문이 있으면 알려주세요.

@migontech의 답변에 덧붙여, 「아마도 보다 범용적인 것으로 할 수 있다」라고 하는 코멘트를 덧붙이자면, 다음과 같은 방법이 있습니다.아래에서는 임의의 속성으로 검색할 수 있습니다.

.filter('getByProperty', function() {
    return function(propertyName, propertyValue, collection) {
        var i=0, len=collection.length;
        for (; i<len; i++) {
            if (collection[i][propertyName] == +propertyValue) {
                return collection[i];
            }
        }
        return null;
    }
});

필터링하는 콜은 다음과 같습니다.

var found = $filter('getByProperty')('id', fish_id, $scope.fish);

문자열 기반 일치를 허용하기 위해 unary(+) 연산자를 제거했습니다.

지저분하고 쉬운 솔루션은

$scope.showdetails = function(fish_id) {
    angular.forEach($scope.fish, function(fish, key) {
        fish.more = fish.id == fish_id;
    });
};

Angularjs에는 이 처리를 위한 필터 옵션이 이미 있습니다.https://docs.angularjs.org/api/ng/filter/filter

당신의 해결책은 정확하지만 불필요하게 복잡합니다.순수 자바스크립트 필터 기능을 사용할 수 있습니다.고객님의 모델은 다음과 같습니다.

     $scope.fishes = [{category:'freshwater', id:'1', name: 'trout', more:'false'},  {category:'freshwater', id:'2', name:'bass', more:'false'}];

그리고 당신의 기능은 다음과 같습니다.

     $scope.showdetails = function(fish_id){
         var found = $scope.fishes.filter({id : fish_id});
         return found;
     };

다음 식을 사용할 수도 있습니다.

     $scope.showdetails = function(fish_id){
         var found = $scope.fishes.filter(function(fish){ return fish.id === fish_id });
         return found;
     };

이 기능에 대한 자세한 내용은 LINK

이 스레드를 보았지만 검색과 일치하지 않는 ID를 검색하려고 했습니다.이를 위한 코드:

found = $filter('filter')($scope.fish, {id: '!fish_id'}, false);

언급URL : https://stackoverflow.com/questions/15610501/in-angular-i-need-to-search-objects-in-an-array

반응형