Фильтр seach внутри родительского ng-repeat не работает - PullRequest
0 голосов
/ 25 октября 2018

У меня есть массив объектов, который показан ниже, который я назвал $scope.parlist.Я уже провел исследование, так что я могу фильтровать свои вложенные ng-repeat всякий раз, когда пользователь ищет конкретную учетную запись, но мне не удалось

[
   {
      bch: "001",
      loan_product: [
         {
            id_code: "ML1",
            asofmonitoring:[{ //asofmonitoring is fixed to have just one object here
                days07:[
                     {
                       loan_no: "ML-XXX-XXX-XXX",
​​​​​​                       name: "John Papa"
                     },
                     {
                       loan_no: "ML-XXX-XXX-XXX",
​​​​​​                       name: "Grace Papa"
                     }
                     ...
                ],
                days08:[
                     {
                       loan_no: "ML-XXX-XXX-XXX",
​​​​​​                       name: "Earl Papa"
                     },
                     {
                       loan_no: "ML-XXX-XXX-XXX",
​​​​​​                       name: "Britney Papa"
                     }
                     ...
                ]
                ...
            }]
         },
         ...
      ]

   }
   ...
]

html

<tbody data-ng-repeat="par in parlist" ng-init="outerindex = $index">
    <tr>
        <td colspan="15" style="background-color:rgb(233, 236, 239)">
            <table class="table table-sm">
                 <tbody ng-repeat="prod in par.loan_product" ng-init="innerindex = $index">
                      <tr>
                         <table>
                             <tbody ng-if="prod.asofmonitoring[0].days07.length > 0">
                                  <tr>
                                      <td colspan="2" class="text-left table-warning">
                                         <input type="text" ng-model="q7[innerindex]" class="form-control" placeholder="Search account" aria-label="Search account" aria-describedby="basic-addon2">
                                       </td>

                                    </tr>
                               </tbody>
                               <tbody ng-repeat="days07 in prod.asofmonitoring[0].days07 | filter:q7[innerindex]">
                                     <tr>
                                         <td class="text-center" ng-bind="days07.loan_no">loading...</td>
                                     </tr>
                               </tbody>
                          </table>
                       </tr>
                   </tbody>
             </table>
         </td>
      </tr>
</tbody>

Моя проблема в том, что я не могу заставить поисковый фильтр работать в моем ng-repeat="days07 in prod.asofmonitoring[0].days07 ng-repeat.Я уже сделал другое предложение, например, поставил ng-init="outerindex = $index" и другое решение, но мой ng-repeat не будет фильтровать.Кто-нибудь может мне помочь с этой проблемой?

1 Ответ

0 голосов
/ 25 октября 2018

У вас возникла проблема с привязкой к области.

И ng-if, и ng-repeat неявно создают новые области.

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

Быстрое решение здесь - явная инициализация q7 вваш контроллер, чтобы гарантировать, что переменная тень не происходит.

Включен урезанный пример ниже для вас:

Редактировать: Обновлено для отражения комментариев.

angular
  .module('app', [])
  .controller('ctrl', function ($scope) {
    // Explicitly declare text filter model so `ng-repeat` does not create shadowed copies
    $scope.q = {};
    $scope.parlist = [
      {
        bch: '001',
        loan_product: [
          {
            id_code: 'ML1',
            asofmonitoring: [
              {
                days07: [
                  {
                    loan_no: 'ML-XXX-XXX-XXX',
                    name: 'John Papa',
                  },
                  {
                    loan_no: 'ML-XXX-XXX-XXX',
                    name: 'Grace Papa',
                  },
                ],
                days08: [
                  {
                    loan_no: 'ML-XXX-XXX-XXX',
                    name: 'Earl Papa',
                  },
                  {
                    loan_no: 'ML-XXX-XXX-XXX',
                    name: 'Britney Papa',
                  },
                ],
              },
            ],
          },
        ],
      },
      {
        bch: '002',
        loan_product: [
          {
            id_code: 'ML1',
            asofmonitoring: [
              {
                days07: [
                  {
                    loan_no: 'ML-XXX-XXX-XXX',
                    name: 'John Papa',
                  },
                  {
                    loan_no: 'ML-XXX-XXX-XXX',
                    name: 'Grace Papa',
                  },
                ],
                days08: [
                  {
                    loan_no: 'ML-XXX-XXX-XXX',
                    name: 'Earl Papa',
                  },
                  {
                    loan_no: 'ML-XXX-XXX-XXX',
                    name: 'Britney Papa',
                  },
                ],
              },
            ],
          },
        ],
      },
    ];
  });

  
    
      
        
      
      
        loading...
      
    
  
  q = {{ q | json }}
...