Как получить значение из ng-repeat, когда событие не из элемента внутри ng-repeat (т.е. не ng-click)

У меня есть предварительная директива нечеткого поиска для тегов категорий:

<input type="text" class="form-control" placeholder="Apply Tags" ng-keydown="checkKeyDown($event)" ng-change="searchTags()" ng-model="searchText">
<div ng-show="searchText.length>0">
    <ul>
        <li ng-repeat="tag in suggestedTags | fuzzySearch : searchText : 'OR' track by $index" ng-class="{active : $index === selectedIndex}">
            {{tag}}
        </li>
    </ul>
</div>

Вот как я справляюсь с вещами

suggestedTags: array of strings that is the full list of tags I want to match
selectedIndex: the index of the filtered suggestedTags, based on searchText
searchText: the string I'm using to match up with suggestedTags

Когда я что-то набираю, нечеткий поиск проверяет, соответствует ли то, что я набрал, чему-либо в массиве, и сокращает список предлагаемых результатов. Это работает нормально.

Однако у меня есть следующий код, который позволяет мне использовать клавиатуру для выбора из отфильтрованного списка (используя клавиши вверх, вниз и ввод):

scope.checkKeyDown = function(event) {
  if (event.keyCode === 40) { //down key, increment selectedIndex
    event.preventDefault();
    if(scope.selectedIndex+1 !== scope.suggestedTags.length){ // check to see if at end of list
      scope.selectedIndex++;
    }
  } else if (event.keyCode === 38) { //up key, decrement selectedIndex
    event.preventDefault();
    if(scope.selectedIndex-1 !== -1){ // check to see if at top of list
      scope.selectedIndex--;
    }
  } else if (event.keyCode === 13) { //enter pressed
    event.preventDefault();
    scope.addToSelectedTags(scope.selectedIndex); //adds to selected tags
  }
}
scope.addToSelectedTags = function (index) {
  if(scope.selectedTags.indexOf(scope.suggestedTags[index]) > -1) return; // Test to see if selectedTags already has this value
    scope.selectedTags.push(scope.suggestedTags[index]);
};

Проблема здесь в том, что selectedIndex будет индексом из списка отфильтровано, но когда я нажму на selectedTags, он будет из полного массива предлагаемых тегов.

Самый простой способ сделать это — просто передать строковое значение из того, что выбрано. Как я могу это сделать? Есть ли способ поместить ng-модель в <li> (что повторяется) и выбрать все, что активно?


javascript angularjs angularjs-directive angularjs-ng-repeat angular-filters
person PGT    schedule 16.06.2015    source источник
comment
Сначала вам нужно, чтобы функция, которую вы вызываете, действительно находилась в ng-repeat, а затем вы можете использовать что-то вроде - checkKeyDown($event, this) и "это" на самом деле объект, который вы повторяете. Не знаю, это ли вы имели в виду в названии. Конечно, вам нужно ссылаться на «это» в функции как на любой другой параметр.   -  person Yousef_Shamshoum    schedule 16.06.2015

Ответы (1)


arrow_upward

arrow_downward

person    schedule
comment
Вы снова использовали addToSelectedTags(), но не уверены, было ли это намеренно или вы хотели использовать другое имя? Если бы это было сделано намеренно, не срабатывала бы эта функция дважды? Один раз, когда запускается checkKeyDown(), и один раз, когда нажимается клавиша, когда элемент li находится в фокусе? Я также считаю, что ng-keydown требует, чтобы элемент был в фокусе, поэтому не уверен, что это сработает для элемента li. - person PGT; 16.06.2015
comment
@PGT ваше беспокойство по поводу фокуса элемента правильное, есть способы справиться с фокусом, но я считаю, что дополнительный контейнер для хранения отфильтрованного результата будет лучше, пожалуйста, проверьте мой обновленный код - person lucas; 17.06.2015
comment
Да, у меня не было возможности обновить свой вопрос, но я обнаружил, что вы можете использовать $filter в контроллере и помещать отфильтрованные результаты в отдельную переменную. Спасибо. - person PGT; 17.06.2015