Фильтрация массива в angular.js

У меня есть массив объектов:Фильтрация массива в angular.js

var arr = [{id:1, name: 'frank', type: 'great'}, {id:2, name: 'john', type: 'good'}, {id:3, name: 'mark', type: 'great'}, {id:4, name: 'mary', type: 'bad'}];

В некоторых моментах, мне нужно напечатать 3 различных HTML-элементов. В каждом из этих элементов будет список имен, имеющих один и тот же тип.

Я мог бы сделать 3 разных итерации, где я просматриваю все предметы. Но мне интересно, есть ли лучший способ. Лучшее, с чем я пришел, это «фильтровать» этот массив для каждой итерации. Даже если я все еще буду цикл 3 раза, возможно, это лучший способ сделать это, , поскольку вы только просматриваете элементы в массиве, который вас действительно интересует.

Im не совсем уверен, как отфильтровать это. Im с использованием угловых.js. Если нет, я могу использовать простой javascript. Или есть лучшее решение для этого?

***** ***** EDIT

Благодаря Duffy за советы по фильтровальной функции. я, возможно, потребуется слишком много, но дело заключается в следующем:

Существует .html, что теперь содержит DIV так:

<div ng-repeat="person in peopleContainer.get_people()">

peopleContainer является завод в services.js-файле. Эта фабричная функция содержит как массив со всеми людьми, так и функции, чтобы добавить одного человека/вернуть массив со всеми людьми.

Теперь (забудьте про фильтрацию) директива ng-repeat выше не работает. Когда я добавляю нового человека, я вижу, что этот человек был добавлен в массив. Но ничего не происходит в div-контейнере. Нет ng-repeat. Может ли это быть потому, что массив с людьми находится в файле service.js? Если да: есть ли способ обойти это?

источник

2016-03-24 oderfla

посмотрите на https://docs.angularjs.org/api/ng/filter/filter – duffy356

Как @ duffy356 сказал, вы можете использовать фильтры.

Редактировать Resolve свое обещание в контроллере :) (SNIPPET обновляется, чтобы разрешить обещание)

var app = angular.module('my-app', []); 
 

 
app.controller('MainCtrl', function($scope, $q, $timeout) { 
 
    $scope.arr = []; 
 
    
 
    $scope.get_people = function(){ 
 
    var results = [{id:1, name: 'frank', type: 'great'}, {id:2, name: 'john', type: 'good'}, {id:3, name: 'mark', type: 'great'}, {id:4, name: 'mary', type: 'bad'}]; 
 
    var deferred = $q.defer(); 
 
    $timeout(function() { deferred.resolve(results); }, Math.random() * 1000, false); 
 
    return deferred.promise; 
 
    } 
 
    
 
    $scope.get_people().then(function(result) { $scope.arr = result;}); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<body ng-app="my-app" ng-controller="MainCtrl"> 
 
    <div ng-repeat="a in arr track by $index"> 
 
    {{ a.name }} {{ a.type }} 
 
    <div style="margin:10px" ng-repeat="aa in arr | filter : { type: a.type } track by $index"> 
 
     {{ aa.name }} <b>{{ aa.type }}</b> 
 
    </div> 
 
    </div> 
 
</body>

источник

2016-03-24 18:03:26

Спасибо. Я редактировал свой вопрос и добавил что-то о директиве ng-repeat. Фильтрация не должна быть проблемой. Но ng-repeat не работает. Может быть, мне нужно сделать массив доступным в области? – oderfla

Ну, я отвечаю. Да, массив с человеком был в сервисах. В моем контроллере я добавил: $ scope.people = servicename.get_people(). После этого в html у меня есть этот div, который ссылается на массив в контроллере. И тогда все работает. – oderfla

Вы можете использовать myPromise.then (функция (результат) {...}, функция (ошибка) {...}) для обработки некоторых возможных ошибок тоже :) –

Не делайте peopleContainer.get_people() в ng-repeat, сделать это в контроллере и добавить результат к переменной с областью, затем используйте ее в ng-repeat.

Контроллер:

$scope.people = peopleContainer.get_people();

HTML:

<div ng-repeat="person in people">

источник

2016-03-24 18:10:34

Фильтрация массива в angular.js

ответ

Смежные вопросы