AngularJS - как получить ссылку на отфильтрованный результат ngRepeat

Я использую директиву ng-repeat с таким фильтром:

ng-repeat="item in items | orderBy:'order_prop' | filter:query | limitTo:4"

и я прекрасно вижу визуализированные результаты; Теперь я хочу запустить логику этого результата в моем контроллере. Вопрос в том, как я могу получить ссылку на элементы результатов?

Обновить:

Чтобы уточнить: я пытаюсь создать автозаполнение, у меня есть следующие данные:

<input id="queryInput" ng-model="query" type="text" size="30" placeholder="Enter query">

а затем отфильтрованные результаты:

<ul>
   <li  ng-repeat="item in items | orderBy:'order_prop' | filter:query | limitTo:4">{{item.name}}</li>
</ul>

теперь я хочу перейти к результату и выбрать один из элементов.

ОБНОВЛЕНИЕ : это более простой способ, чем то, что было раньше.

 <input ng-model="query">
 <div ng-repeat="item in (filteredItems = (items | orderBy:'order_prop' | filter:query | limitTo:4))">
   {{item}}
 </div>

Тогда $scope.filteredItemsдоступно.

Вот версия с фильтром решения Энди Джослина.

Обновление: ПРЕРЫВАНИЕ ИЗМЕНЕНИЙ. Начиная с версии 1.3.0-beta.19 ( эта фиксация ) фильтры не имеют контекста и thisбудут привязаны к глобальной области. Вы можете передать контекст в качестве аргумента или использовать новый синтаксис псевдонимов в ngRepeat , 1.3.0-beta.17 +.

// pre 1.3.0-beta.19
yourModule.filter("as", function($parse) {
  return function(value, path) {
    return $parse(path).assign(this, value);
  };
});

// 1.3.0-beta.19+
yourModule.filter("as", function($parse) {
  return function(value, context, path) {
    return $parse(path).assign(context, value);
  };
});

Тогда на ваш взгляд

<!-- pre 1.3.0-beta.19 -->
<input ng-model="query">
<div ng-repeat="item in items | orderBy:'order_prop' | filter:query | limitTo:4 | as:'filteredItems'">
 {{item}}
</div>

<!-- 1.3.0-beta.19+ -->
<input ng-model="query">
<div ng-repeat="item in items | orderBy:'order_prop' | filter:query | limitTo:4 | as:this:'filteredItems'">
 {{item}}
</div>

<!-- 1.3.0-beta.17+ ngRepeat aliasing -->
<input ng-model="query">
<div ng-repeat="item in items | orderBy:'order_prop' | filter:query | limitTo:4 as filteredItems">
 {{item}}
</div>

Что дает вам доступ к $scope.filteredItems.

Попробуйте что-то вроде этого, проблема с ng-repeat в том, что он создает дочернюю область, из-за которой вы не можете получить доступ

filteritems

от контроллера

<li ng-repeat="doc in $parent.filteritems = (docs | filter:searchitems)" ></li>

Обновить:

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

<div>{{labelResults}}</div>
<li ng-repeat="label in (labels | filter:query | as labelResults)">
</div>

вышеуказанное не сработает. Чтобы обойти это, используйте $ parent так:

<li ng-repeat="label in ($parent.labelResults = (labels | filter:query))">

Я придумал несколько лучшую версию решения Энди. В своем решении ng-repeat устанавливает наблюдение за выражением, содержащим присвоение. Каждый цикл дайджеста будет оценивать это выражение и присваивать результат переменной области видимости.

Проблема с этим решением заключается в том, что вы можете столкнуться с проблемами назначения, если находитесь в дочерней области. По этой же причине у вас должна быть точка в ng-модели .

Еще одна вещь, которая мне не нравится в этом решении, заключается в том, что оно скрывает определение фильтрованного массива где-то в разметке представления. Если он используется в нескольких местах вашего представления или вашего контроллера, это может сбить с толку.

Более простое решение - просто поместить часы в контроллер на функцию, которая выполняет назначение:

$scope.$watch(function () {
    $scope.filteredItems = $scope.$eval("items | orderBy:'order_prop' | filter:query | limitTo:4");
});

Эта функция будет оцениваться во время каждого цикла дайджеста, поэтому производительность должна быть сопоставима с решением Энди. Вы также можете добавить любое количество назначений в функцию, чтобы все они находились в одном месте, а не разбросаны по представлению.

В представлении вы просто использовали бы отфильтрованный список напрямую:

<ul>
    <li  ng-repeat="item in filteredItems">{{item.name}}</li>
</ul>

Вот скрипка, где это показано в более сложном сценарии.

Отметьте этот ответ:

Выбор и доступ к элементам в ng-repeat

<li ng-repeat="item in ..." ng-click="select_item(item)">