Угловой фильтр и ng-click не работают

У меня есть меню для перечисления группы списков:

<ul>
  <li ng-repeat="group in getData">
    <a ng-click="groupId = group.id">{{group.id}}</a>
  </li>
</ul>

Щелчок по элементу должен обновить groupId, но, видимо, это не так.

Я также создал фильтр, который получает значение из groupId:

Data.query(function(data) {
  $scope.getData = data;
  $scope.currentGroup =  $filter('filter')(data, {id: $scope.groupId});
  $log.debug($scope.groupId);
  $log.debug($scope.currentGroup);
}, function(reason) {
  $log.error(reason)
});

Это должно отфильтровать следующий список, чтобы отображались только элементы с выбранным groupId:

<tr ng-repeat="list in currentGroup.lists">
  <td>{{list.name}}</td>
</tr>

Однако тоже не работает. Я могу зарегистрировать правильный массив в консоли, но таблица не отображает никаких данных.

Пожалуйста, взгляните на этот планкер.


javascript filter angularjs angularjs-ng-click ng-repeat
person brians69    schedule 13.05.2016    source источник
comment
вам нужно вызвать метод вместо предоставления значений в ng-click   -  person Pravesh Khatri    schedule 13.05.2016
comment
@PraveshKhatri, не могли бы вы привести один пример, пожалуйста?   -  person brians69    schedule 13.05.2016

Ответы (2)


arrow_upward
1
arrow_downward

Есть несколько проблем с вашим кодом. Вот 2:

  1. ng-repeat создает свою собственную дочернюю область, поэтому, когда вы делаете ng-click="groupId = group.id", вы назначаете дочернюю область groupId, вы должны установить родительскую:

    <a ng-click="$parent.groupId = group.id">{{group.id}}</a>

    но это выглядит не очень хорошо; попробуйте использовать as синтаксис или назначьте его из функции.

  2. $filter возвращает массив, поэтому вам нужно выбрать первый элемент, чтобы правильно назначить currentGroup:

    $scope.currentGroup =  $filter('filter')(data, {id: $scope.groupId})[0];

Вот плункер с этими двумя фиксированными:

http://plnkr.co/edit/f9ylUZ9mpInB00zzlYQd?p=preview

person Saeb Amini    schedule 13.05.2016
comment
спс за пример! вы знаете, почему он не обновляет таблицу при нажатии на ссылку? разве он не должен обновлять фильтр? - person brians69; 13.05.2016
comment
@drbishop, а зачем? ваш код $filter находится в функции, которая вызывается только один раз. - person Saeb Amini; 13.05.2016
comment
Я понимаю. Я попытался вызвать его вне функции, но тогда он не работает, поскольку $scope.getData равно undefined. Есть лучший способ сделать это? - person brians69; 13.05.2016
comment
@drbishop Одним из способов было бы изменить ваше представление, чтобы получить списки из функции, чтобы фильтр всегда вызывался: например: plnkr.co/edit/f9ylUZ9mpInB00zzlYQd?p=preview - person Saeb Amini; 13.05.2016
comment
Спасибо, я очень ценю вашу помощь. - person brians69; 13.05.2016

arrow_upward
1
arrow_downward

В вашем плункере вы можете использовать его так:

<table>
    <tr ng-repeat="group in currentGroup">
      <td ng-repeat="list in group.lists">{{list.name}}</td>
    </tr>
</table>

потому что currentGroup также является массивом

person sumair    schedule 13.05.2016
comment
Я проголосовал, но я новый пользователь, мой голос отображается только после того, как я наберу 15 очков репутации. - person brians69; 14.05.2016