Come disabilitare un di selezione dell'elemento quando si utilizza AngularJS NG-Options?
https://stackoverflow.com//questions/21002616
-
20-12-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianDomanda
C'è un modo per disabilitare un option in un elemento select quando popoliamo options con opzioni NG in AngularJS?
In questo modo: http://www.w3schools.com/tags/att_option_disabled.asps.asption./A>
Soluzione
Un modo per farlo è, per dimenticare l'uso di ng-options sull'elemento select e aggiungere le opzioni con ng-repeat, quindi è possibile aggiungere un controllo ng-disabled su ciascun option.
<div ng-app="myapp">
<form ng-controller="ctrl">
<select id="t1" ng-model="curval">
<option ng-repeat="i in options" value="{{i}}" ng-disabled="disabled[i]">{{i}}</option>
</select>
<button ng-click="disabled[curval]=true">disable</button>
</form>
</div>
Un controller minimo per il test:
angular.module('myapp',[]).controller("ctrl", function($scope){
$scope.options=['test1','test2','test3','test4','test5'];
$scope.disabled={};
})
Altri suggerimenti
Da Angular 1.4 :
Possiamo utilizzare disable when in opzioni NG, ad esempio:
$scope.colors = [
{name:'black', shade:'dark'},
{name:'white', shade:'light', notAnOption: true},
{name:'red', shade:'dark'},
{name:'blue', shade:'dark', notAnOption: true},
{name:'yellow', shade:'light', notAnOption: false}
];
$scope.myColor = $scope.colors[2]; // red
Questo esempio ha colori raggruppati per ombra, con alcuni disabilitati:
<select ng-model="myColor" ng-options="color.name group by color.shade disable when color.notAnOption for color in colors"></select>
Ho ricevuto questo codice da La documentazione angolare .
Dovresti utilizzare la direttiva ng-disabled http://docs.angularjs.org/api/api.directive: ngDisabled .
<body ng-app="myApp">
<div ng-controller="myCtrl">
<form class="form-inline">
<div class="form-group">
<select class="form-control" ng-disabled="disableSelect">
<option val="one">First</option>
<option val="two">Second</option>
</select>
</div>
<button class="btn btn-default" ng-click="disableSelect = !disableSelect">
Disable select
</button>
</form>
</div>
</body>
Qui è possibile trovare l'esempio completo
Risolvi con la versione 1.4 https://docs.angularjs.org/api/ng/Direttiva / NGOPZIONI [Controlla il doppio che cerchi la documentazione V1.4]
Probabilmente qualcosa come questo
<button ng-click='disableSelect=true'></button>
<select ng-disabled='disableSelect'></select>
