Опережающий ввод текста каждый раз, когда пользователь пишет определенное слово

Я использую тип ui-bootstrap, когда пользователь вводит, чтобы показать все переменные, доступные для записи, которые являются свойствами загружаемого объекта. Пример: item.cost+item.quantity.

Мой вопрос: я хочу, чтобы предложения появлялись только каждый раз, когда пользователь вводит элемент. Я заметил, что ввод текста работает только для одного слова и в начале.

HTML

<div class="modal-body">
          Add expression:
            <textarea style="width: 568px;" ng-model="item.formula"
                      uib-typeahead="state for state in states " 
                     typeahead-show-hint="true"
                     typeahead-on-select="item"
                      ng-change="eval(item.formula)">
            </textarea>
            <p><b>Result:</b> <br>
            <div style="width: 100%">{{ans}}
            </div>
            </p>
            </div>

контроллер

 ctrl.controller('myController', ['$scope', function ($scope) {
$scope.imageShowModal = function (item) { //loads the object items
    $scope.item = item;
    $scope.states =Object.keys(item); //get the JSON keys from item object like cost,price,quantity,workflow...
};

$scope.eval = function (v) {
    try {
        $scope.ans = $scope.$eval(v);
    } catch (e) {
    }
};

html angularjs angular-ui-bootstrap angular-ui-typeahead
person changez    schedule 26.01.2016    source источник
comment
Я бы предложил написать свою собственную директиву, где в событии keyDown вы могли бы проверить, была ли нажатая клавиша пробелом, а затем взять последнее слово из поля ввода.   -  person Jānis    schedule 26.01.2016

Ответы (1)


arrow_upward
0
arrow_downward

Вы можете использовать собственный фильтр в выражении uib-typeahead, например: uib-typeahead="state for state in states | myCustomFilter:$viewValue"

Пользовательский фильтр в вашем случае может выглядеть так:

angular.module('myApp')
  .filter('myCustomFilter', function() {
    return function(list, term) {
      if (term.indexOf('item.') === -1)
        return [];

      var filteredList = [];
      angular.forEach(list, function(value) {
        if (value.indexOf(term) !== -1)
          filteredList.push(value);
      });

      return filteredList;
    }
  });

См. также: совпадение типов пользовательского интерфейса AngularJs с начальными символами

person Shaun Scovil    schedule 26.01.2016
comment
что вы подразумеваете под списком и filteredList? - person changez; 26.01.2016
comment
Ваша переменная $scope.states представляет собой массив (или список) ключей. Это то, что фильтруется. - person Shaun Scovil; 26.01.2016
comment
он говорит Неизвестный поставщик: listProvider ‹- list ‹- myCustomFilterFilter - person changez; 26.01.2016
comment
Еще это у вас есть список в начале, но вы его нигде не называете. И ничего не помещает в filteredList. Я внес изменения, я создам свой список вручную, включая элемент. потому что какой-то ключ, который я не хочу включать. Другое дело, если он снова пропишет другую переменную для активации опережающего ввода. это работает только в начале, я попробую сделать планк - person changez; 26.01.2016
comment
Хороший улов, в моем вызове forEach отсутствовал первый параметр. Делаю это по памяти на своем мобильном. Я обновил свой пример. - person Shaun Scovil; 26.01.2016
comment
Давайте продолжим это обсуждение в чате. - person changez; 26.01.2016