Фильтры не работают с массивом из ресурса

Question

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

Это работает:

$filter('filter')([
  {"name":"firstItem","code":"one"},
  {"name":"secondItem","code":"two"},
  {"name":"thirdItem","code":"three"}
],"two",true);

Это не:

$filter('filter')($scope.items,"two",true);

Угловой образец:

angular.module('App', ['ngResource'])

.controller('Ctrl', function($scope, $filter, Items) {
  $scope.items = Items.query();
  var codeToFilter = "two";
  $scope.badFilter = $filter('filter')($scope.items,codeToFilter,true);
  $scope.goodFilter = $filter('filter')([
    {"name":"firstItem","code":"one"},
    {"name":"secondItem","code":"two"},
    {"name":"thirdItem","code":"three"}
  ],"two",true);
})

.factory("Items", function ($resource) {
    return $resource("item-list.asp");
});

И массив, возвращаемый из item-list.asp:

[{"name":"firstItem","code":"one"},{"name":"secondItem","code":"two"},{"name":"thirdItem","code":"three"}]

Вот что я вижу на странице:

Bad Filter: []
Good Filter: [{"name":"secondItem","code":"two"}]

Answer 1

Items.query() является асинхронным и, следовательно, не разрешается мгновенно. В то время как ваш фильтр включен, он не заполнен.

Установите это так:

Items.query(function(result) {
    $scope.items = result;
    $scope.badFilter = $filter('filter')($scope.items,codeToFilter,true);
});

Answer 2

Попробуйте это добавить массив в элемент управления, чтобы помочь передать информацию в функцию.

.controller('Ctrl', ['$scope', '$filter', 'Items', function($scope, $filter, Items) {

а затем не забудьте закрыть квадратную скобку после того, как функции закройте фигурную скобку