замените $ scope.items при нажатии кнопки

Question

У меня есть список элементов в массиве в моей области действия. Он повторяется с повторением ng на моем представлении. Теперь, основываясь на событии click, я хотел бы фильтровать массив, чтобы показывать все или только мои объекты. Каков наилучший способ сделать это?

Вот кнопка, которую я хочу использовать для переключения между этими двумя массивами:

<div class="btn-group btn-group-custom1"> 
    <label class="btn btn-sm" ng-click="pL.myitems()" uib-btn-radio="'Middle'">Just mine</label> 
    <label class="btn btn-sm" ng-click="pL.allitems()" uib-btn-radio="'Right'">All itmes</label> 
</div> 

в моем контроллере на создание объекта я дополнительный создать резервную переменную области действия, поэтому я всегда могу вернуть оригинал array ($ scope.items _all).

Я стараюсь это так, к сожалению, без успеха:

$scope.pL = { 
     myitems: function() { 
      $scope.items = $filter('filter')($scope.item_filter, { agent: uid }); 
     }, 
     allitems: function() { 
      $scope.items = $scope.items_all; 
     } 
    }; 

Answer 1

То, что вы хотите это filter. С помощью фильтров вы можете определить функцию, которая при передаче массива вернет массив, как вы хотите, без потери оригинала (и прост в использовании и повторном использовании в представлении).

Пример:

angular.module('yourModule') 
.filter('arbitraryFilter', [function() { 
     return function (inputArray, filterArray) { 
      if(!filterArray) return inputArray; //This will return the unfiltered array. 
      var resultArray = []; 
      for(var i=0;i<inputArray.length;i++) 
       if(inputArray[i].someProperty === 'property to include') 
        resultArray.push(inputArray[i]); 
      return resultArray; 
     }; 
    }]) 
.controller('yourController',['$scope', function($scope){ 
    $scope.filterArray = false; 
    $scope.toggleFilterArray = function(){ $scope.filterArray = !$scope.filterArray;}; 
}]) 

На ваш взгляд:

<div ng-click="toggleFilterArray()">Toggle array filter</div> 
<div ng-repeat="item in yourArray | arbitraryFilter:filterArray ">item.value</div> 

Как последний комментарий, я сильно предлагаю вам не использовать JQuery в AngularJS приложении. Есть целые статьи о том, почему вы не должны смешивать их, и я бы честно предложил вам удалить любой jQuery, который вы уже включили, и переделать его с помощью углового ориентирования.

Answer 2

Другая реализация;

<div ng-repeat="item in items | filter: uid as results"> 

в JavaScript:

$scope.pL = { 
    myitems: function() { 
     $scope.uid = 101 ; //enter your uid 
    }); 
    }, 
    allitems: function() { 
     $scope.uid = ""; //all 
    } 
};