Угловой: применить фильтры к повторению

Question

Угловой: применить фильтры к повторению

0

Я пытаюсь применить фильтр к массиву, так как он изменяется в JS, он возвращается обратно в HTML (из-за двусторонней привязки). Это контроллер, который я использую:

app.controller('controlador1', ["filterFilter", "$scope", function(filterFilter, $scope) {

   this.array = [
    {name: 'Tobias'},
    {name: 'Jeff'},
    {name: 'Brian'},
    {name: 'Igor'},
    {name: 'James'},
    {name: 'Brad'}
  ];
  var active = false;
  $scope.applyFilter = function(){
   if(!active){
    $scope.arrayFiltrado = filterFilter(this.array, "a");
    active = true;
   }else{
    $scope.arrayFiltrado = this.array;
    active = false;
   }
  }
  $scope.arrayFiltrado = this.array;

}]);

Кроме того, это мой HTML-шаблон:

<!DOCTYPE html>
<html ng-app="miApp">
    <head>
        <meta charset="UTF-8">
        <script src="angular.js"></script>
        <script src="mainmodule.js"></script>
        <link rel="stylesheet" href="bootstrap/css/bootstrap.css">
    </head>
<body ng-app="miApp" ng-controller="controlador1">
 <button type="button" class="btn btn-default" ng-click="applyFilter()">button</button>
 <span ng-repeat="elem in arrayFiltrado">{{elem.name+" "}}</span>
 </body>
</html>

Я хочу применить/деактивировать фильтр, когда я нажимаю кнопку, но независимо от того, что я делаю, если я нажму кнопку, в HTML ничего не отображается. Это похоже на то, что массив стирается.

Может ли кто-нибудь сказать мне, что мне здесь не хватает?

Zerok 28 янв. 2016, в 15:10

Источник

0

Нужно было бы увидеть filterFilter
Raulucco 28 янв. 2016, в 13:31
0

Фильтр работает правильно. Если я просто применяю одно действие фильтрации в начале, это работает. Проблема появляется, когда я запускаю опцию ng-click, которая приводит к исчезновению списка имен.
Zerok 28 янв. 2016, в 13:33

Теги:

javascript

angularjs

html5

2 ответа

0

Если ваш фильтр работает правильно, вместо этого this.array вы должны использовать $scope.array

$scope.array = [....];

а также

$scope.arrayFiltrado = filterFilter($scope.array, "a");
$scope.arrayFiltrado = $scope.array;

Shaishab Roy 28 янв. 2016, в 11:54

Ещё вопросы

Фильтр работает правильно. Если я просто применяю одно действие фильтрации в начале, это работает. Проблема появляется, когда я запускаю опцию ng-click, которая приводит к исчезновению списка имен.

Yoann Prot · Accepted Answer · 2016-01-28T11-14-00.000Z

Для этого вы можете использовать только угловое связывание. Это позволяет избежать большого количества кода на вашем контроллере и упростить логику.

JS

app.controller('controlador1', ["filterFilter", "$scope", function(filterFilter, $scope) {
    $scope.active = false;

    $scope.arrayFiltrado = [
        {name: 'Tobias'},
            {name: 'Jeff'},
            {name: 'Brian'},
            {name: 'Igor'},
            {name: 'James'},
            {name: 'Brad'}
        ];

    $scope.filtering = function(item) {
        if(!$scope.active) {
            return true;
        }
        return item.name.indexOf('a') !== -1;
    }
}]);

HTML

<body ng-app="miApp" ng-controller="controlador1">
    <button type="button" class="btn btn-default" ng-click="active = !active">button</button>
    <span ng-repeat="elem in arrayFiltrado | filter:filtering">{{elem.name+" "}}</span>
</body>

Ваш код действительно работает отлично! Итак, я вижу, что не могу привязать данные к обычному элементу JS, но к элементу угла?
Основная проблема возникает из-за этого: это зависит от контекста. Вам следует избегать его использования (до тех пор, пока вы не переключитесь на ES6;), потому что это не то же самое «this» в вашем контроллере и в функции applyFilter. Просто используйте 'var array' или '$ scope.array'