angularjs фильтр на вложенных объектах

Question

Я совершенно новый с angularjs, поэтому я не уверен, что то, что я пытаюсь сделать, это правильный путь. В принципе, я хочу отображать на своей странице вложенный объект и фильтр, таким образом, пользователь может легко вводить ключевые слова на входе, а контент фильтруется, чтобы отображать только образы, найденные фильтром.

Однако я обратите внимание, что фильтр получает весь родительский объект, и я ожидал показать только запись, поэтому со следующим кодом, если я буду искать Японию, он отобразит Сидней, Мельбурн и Лос-Анджелес.

Javascript

<script type="text/javascript"> 
    var demoApp = angular.module('demoApp',['ngSanitize']); 
    demoApp.controller('simpleC',['$scope', function ($scope){ 
     $scope.info = [ 
     {name: 'Documents',links: [ 
       {linkname:'title1',linknamesublink:[ 
         {namesublink:'document 1', description: 'Sydney'}, 
         {namesublink:'document 2', description: 'Tokyo <b>Japan</b>'} 
         ]}, 
       {linkname:'title2',linknamesublink:[ 
         {namesublink:'document 3', description: 'Melbourne'}, 
         {namesublink:'document 4', description: 'Los Angeles'} 
         ]} 
       ]}, 
     {name: 'Video',links: [ 
       {linkname:'title1',linknamesublink:[ 
         {namesublink:'video 1', description: 'California'}, 
         {namesublink:'video 2', description: 'San Francisco <b> USA</b>'} 
         ]}, 
       {linkname:'title2',linknamesublink:[ 
         {namesublink:'video 3', description: 'South America'}, 
         {namesublink:'video 4', description: 'Northern <b>Europe</b>'} 
         ]}, 
       {linkname:'title3',linknamesublink:[ 
         {namesublink:'video name 5', description: 'Africa'}, 
         {namesublink:'video name 6', description: 'Bangkok <b>Thailand</b>'} 
         ]} 
       ]}, 
     ]; 
    }]); 
</script> 

HTML:

<div class="container" ng-app="demoApp"> 
    <br /><input type="text" class="form-control" ng-model="search" >   
    <div ng-controller="simpleC"> 
     <div ng-repeat="i in info | filter:search" > 
      {{i.name}} : 
      <div ng-repeat="link in i.links"> 
       {{link.linkname}} 
        <div ng-repeat="sublink in link.linknamesublink"> 
          {{sublink.namesublink}}: <!--{{sublink.description}}--> 
          <span ng-bind-html="sublink.description"></span> 
        </div> 
      </div> 
     </div>  
    </div> 
</div> 

Answer 1

Написать свою собственную функцию фильтра. Таким образом, у вас есть полный контроль над тем, что возвращается. https://docs.angularjs.org/api/ng/filter/filter

module.filter('searchfilter', function() { 
    return function(searchexpr) { 
    var filteredList = ['my', 'filtered', 'result'];//implement yourself 
    return filteredList; 
    }; 
}); 

и использовать searchfilter вместо filter в разметке.

Или попробуйте использовать функцию фильтра, как описано здесь: http://fdietz.github.io/recipes-with-angular-js/common-user-interface-patterns/filtering-and-sorting-a-list.html (насколько я могу судить, вы не определили функцию поиска, то есть первое выражение для выражения фильтра).

Answer 2

Modified:

Если вы хотите, чтобы фильтровать объекты на основе любого поля (скажем, "имя"), вы можете использовать форму ниже

<div ng-repeat="i in info" ng-if="search==i.name"> 

Answer 3

Следуйте этому примеру

http://www.whatibroke.com/?p=857

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

Автор хочет фильтровать свойство почтового индекса на значение searc_postcode. Итак, он написал // фильтр {почтовый индекс: search_postcode} //

Пс. Извините, я неверно истолковал ваш вопрос.