Угловое значение по умолчанию для выбора из фильтра

0

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

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

angular.forEach(vm.data,function(item){
if (vm.q == item.someId && item.isDefault) {
vm.result = item.value;
}
});

Мой html выглядит примерно так

<div ng-app="myApp" ng-controller="ctrl as vm">
  <input type="text" ng-model="vm.q">
  <select ng-options="item.value as item.description for item in vm.data | filter:{someId:vm.q}" ng-model="vm.result"></select>
</div>

и мой контроллер выглядит так:

(function(){
    angular.module('myApp',[]);
    angular
        .module('myApp')
        .controller('ctrl',ctrl);

    function ctrl()
    {
        var vm = this;

        vm.data = [
            {
                someId: '1',
                description: 'test1',
                value: 100,
                isDefault: true
            },
            {
                someId: '2',
                description: 'test2',
                value: 200,
                isDefault: false
            },
            {
                someId: '3',
                description: 'test3',
                value: 100,
                isDefault: true
            },        
        ];
    }
})();

Смотрите мою демонстрацию plunkr здесь: http://plnkr.co/edit/RDhQWQcHFMQJvwOyHI4r?p=preview

Желаемое поведение: 1) Введите 1 в текстовое поле. 2) Список должен быть отфильтрован на 2 элемента. 3) Поле выбора должно предварительно выбрать элемент 1 на основе свойства isDefault, установленного в true

заранее спасибо

Теги:

1 ответ

0

Я бы посоветовал вам включить в ваш проект некоторую стороннюю библиотеку, такую как lodash, чтобы упростить работу с массивами/коллекциями.

После этого вы можете добавить директиву ng-change для input.

<input type="text" ng-model="vm.q" ng-change="vm.onChange(vm.q)">

И фактическая функция onChange в контроллере

vm.onChange = function(id) {
  var item = _.findWhere(vm.data, { someId: id, isDefault: true });
  vm.result = item ? item.value : null;
};

И вот он у вас есть.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню