2013-08-29 2 views
7

У меня есть угловой вложенный объект, подобный этому. есть способ, как фильтровать для вложенного имуществаФильтр Angularjs вложенный объект

<li ng-repeat="shop in shops | filter:search"> 
search.locations.city_id = 22 

Я показываю только родительский элемент, но хотите, чтобы фильтровать и из него, как:

search = 
    category_id: 2 
    locations: 
    city_id: 368 

[ 
name: "xxx" 
category_id: 1 
locations: [ 
    city_id: 368 
    region_id: 4 
    , 
    city_id: 368 
    region_id: 4 
    , 
    city_id: 368 
    region_id: 4 
    ] 
, 
name: "xxx" 
category_id: 2 
locations: [ 
    city_id: 30 
    region_id: 4 
    , 
    city_id: 22 
    region_id: 2 
    ] 
] 

ответ

8

Да, вы можете, если я правильно поняли ваш пример.

В зависимости от размера вашей коллекции может быть лучше вычислить коллекцию, которую вы перебираете в ng-repeat, чтобы фильтр не делал это постоянно по мере изменения модели.

http://jsfiddle.net/suCWn/

В основном вы делаете что-то вроде этого, если я вас правильно понял:

$scope.search = function (shop) { 

    if ($scope.selectedCityId === undefined || $scope.selectedCityId.length === 0) { 
     return true; 
    } 

    var found = false; 
    angular.forEach(shop.locations, function (location) {   
     if (location.city_id === parseInt($scope.selectedCityId)) { 
      found = true; 
     } 
    }); 

    return found; 
}; 
23

Вы также можете выбирать, как это (версия 1.2.13+)

<li ng-repeat="shop in shops | filter: { locations: [{ city_id: search.locations.city_id }] }"> 
+1

хорошо это работает, но по умолчанию результаты не показаны только после ввода. http://jsfiddle.net/suCWn/12/ – zajca

+1

Я немного изменил вашу скрипку: [link] (http://jsfiddle.net/suCWn/15/) – martinoss

+2

@zajca вы можете обойти это, присвоив модели значение в контроллере : '$ scope.selectedCityId = '''. Это влияет на загрузку всех элементов перед изменением вручную ввода. –

0

Обновлено «Слова, подобные Джареду», отвечают на использование регулярных выражений, чтобы проверить, содержит ли он поисковик. Таким образом, начинается фильтрация при вводе 1 числа, так что вы не должны совпадать слово целиком

JSfiddle

angular.forEach(shop.locations, function (location) {   
     if (checknum(location.city_id)) { 
      found = true; 
     } 
    }); 

    function checknum(num){ 
     var regx = new RegExp($scope.selectedCityId); 
     return regx.test(num); 
    }; 
Смежные вопросы