我在textbox上使用bootstrap-multiselect和相同的选项
<label>Options:</label>
<div ng-model="val.options" ng-dropdown-multiselect="" options="array" extra-settings="settings2" events="events"> </div>
<label>Codes:</label>
<label>A:</label>
<input type="text" ng-model="val.A" ng-disabled="aDisable">
<label>B:</label>
<input type="text" ng-model="val.B" ng-disabled="bDisable">
<label>C:</label>
<input type="text" ng-model="val.C" ng-disabled="cDisable">
<label>D:</label>
<input type="text" ng-model="val.D" ng-disabled="dDisable">
<label>E:</label>
<input type="text" ng-model="val.E" ng-disabled="eDisable">
</div>
指令代码: -
(function () {
'use strict';
angular.module('myApp.components')
.directive('options', options);
options.$inject = ['$http' , '$timeout];
function branch($http, $timeout) {
return {
restrict: 'EA',
scope: {
},
controller: function ($scope) {
$scope.disable = function(){
$scope.aDisable = true;
$scope.bDisable = true;
$scope.cDisable = true;
$scope.dDisable = true;
$scope.eDisable = true;
};
$scope.disable();
$scope.array = [{
name: "A"
}, {
name: "B"
}, {
name: "C"
}, {
name: "D"
}, {
name: "E"
}];
$scope.settings = {
smartButtonMaxItems: 11,
scrollable: true,
displayProp: "name",
idProp: "name",
externalIdProp: "name"
};
$scope.settings2 = {
smartButtonMaxItems: 7,
scrollable: true,
displayProp: "name",
idProp: "name",
externalIdProp: "name",
};
$scope.enabling = function(e){
switch(e) {
case 'A': $scope.aDisable = false;
break;
case 'B': $scope.bDisable = false;
break;
case 'C': $scope.cDisable = false;
break;
case 'D': $scope.dDisable = false;
break;
case 'E': $scope.eDisable = false;
break;
}
};
$scope.events = {
onItemSelect: function(item){
switch(item.name) {
case 'A': $scope.aDisable = false;
break;
case 'B': $scope.bDisable = false;
break;
case 'C': $scope.cDisable = false;
break;
case 'D': $scope.dDisable = false;
break;
case 'E': $scope.eDisable = false;
break;
}
},
onItemDeselect: function(item){
switch(item.name) {
case 'A': $scope.aDisable = true;
break;
case 'B': $scope.bDisable = true;
break;
case 'C': $scope.cDisable = true;
break;
case 'D': $scope.dDisable = true;
break;
case 'E': $scope.eDisable = true;
break;
}
}
};
}
},
templateUrl: ''
};
}
})();
我在这里遇到的问题是当我点击“检查所有”时。所有文本框都已启用,但是当我点击“取消选中所有文本框”时他们没有禁用。我该怎么办?