2015-06-23 7 views
1

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

Моя проблема в том, что я не могу прослушивать количество опций в select (или, по крайней мере, пока не удалось найти способ). То есть моя идея заключалась бы в том, чтобы сделать что-то подобное в функции ссылок. Основной выбор (саморазрушающийся быть моей директива):

<select name="field1" ng-model="data.field1" ng-options="i.value as i.text for i in values" auto-disable > 
    <option disabled value="" style="display: none;">placeholder</option> 
</select> 

и метод ссылки определяются как таковые:

link: function (scope, elem, attrs) { 
    scope.$watch(elem[0].length, function() { 
    elem.prop('disabled', elem[0].length <= 1); 
    }); 
} 

Итак: Есть ли какой-нибудь способ, чтобы посмотреть элементы в избранном, или могут Я каким-то образом легко могу получить доступ к опции выбора select внутри ng-disabled?

PS: Я уже пробовал слушать «data.field1», но это не работает во всех случаях (например, если изменяются только другие значения, но выбранное значение не работает).

+0

D вы хотите полностью отключить 'select'when есть только один элемент? –

+0

yep и ng-options печально выбрасывают фильтры на мои входные данные, так что не повезло:/ – FrankyBoy

ответ

1

Если я понимаю, что вам нужно здесь есть JSFiddle, чтобы отключить выбор, когда есть меньше чем 2 элементов, вам не нужна директива просто посмотреть на длине массива:

HTML:

<div ng-app ng-controller="MyCtrl"> 
    <select name="field1" ng-model="data.field1" ng-options="i.value as i.text for i in values | filter: { valid: true }" ng-disabled="(values |filter: { valid: true }).length < 2"> 
</div> 

JS:

function MyCtrl($scope) { 
    $scope.values = 
    [ 
     {value: 'hello', text: 'world', valid: true}, 
     {value: 'hello2', text: 'world', valid: false}, 
     {value: 'hello3', text: 'world', valid: false}, 
     {value: 'hello4', text: 'world', valid: false}, 
    ]; 
} 

EDIT USING Директиву:

HTML:

<div ng-controller="MyCtrl"> 
    <select id="field1" ng-model="data.field1" ng-options="i.value as i.text for i in values | filter: { valid: true }" auto-disable></select> 
</div> 

JS ДИРЕКТИВА:

app.directive('autoDisable', function() { 
    return { 
     restrict: 'A', 
     replace: true, 
     link: function(scope, elm, attrs) { 
      angular.element(document).ready(function() { 
       if ((elm[0].options.length - 1) < 2) { 
        elm.attr("disabled", "disabled"); 
       } 
      }); 
     } 
    }; 
}); 

Почему вы должны вычесть 1 из options.length? Поскольку ng-options автоматически добавляет 1 пустую опцию, которую вы должны удалить из счета.

Надеется, что это помогает

Вот в JSFiddle с директивой:

+0

Это мило и все, но это не так смешно, если ваши ng-опции также выбрасывают несколько фильтров на ваши данные. – FrankyBoy

+0

Можете ли вы обновить скрипку тем, что вы говорите, извините, я не могу понять. –

+0

done http://jsfiddle.net/ekn6x0bp/1/ – FrankyBoy

Смежные вопросы