My directive has
我的指令
link: function ($scope, $elm, $attrs) {
var status = $scope.item.status
if (status) {
var statusName = status.name,
item = $scope.item;
if (statusName === 'USED') {
$attrs.$set('ng-disabled', true); // this doesn't work
} else {
$elm.attr('ng-disabled', false);
}
}
}
So, my question is:
所以,我的问题是:
How to apply ng-disabled to element with this directive?
如何应用ng禁用元素与此指令?
3 个解决方案
#1
13
You would set ng-disabled
to a scope variable, ex:
您将把ng禁用设置为范围变量,例如:
<input ng-disabled="isDisabled" />
And then inside your directive you can set that variable:
然后在你的指令中你可以设置这个变量:
$scope.isDisabled = true;
#2
13
if (statusName === 'USED') {
$attrs.$set('disabled', 'disabled');
} else {
$elm.removeAttr('disabled');
}
Why invoke ng-disable at all? You're already once evaluating the condition yourself, so having ng-disable evaluating it again is redundant.
为什么要调用ng-disable ?你已经自己评估了一次条件,所以让ng-disable评估再次评估是多余的。
#3
4
//html
<div ng-app="miniapp" ng-controller="MainCtrl">
<input type="submit" mydir>
</div>
//js
'use strict';
var app = angular.module('miniapp', []);
app.directive('mydir', function ($compile) {
return {
priority:1001, // compiles first
terminal:true, // prevent lower priority directives to compile after it
compile: function(el) {
el.removeAttr('mydir'); // necessary to avoid infinite compile loop
return function(scope){
var status = scope.item.status
if (status === 'USED') {
el.attr('ng-disabled',true);
} else {
el.attr('ng-disabled',false);
}
var fn = $compile(el);
fn(scope);
};
}
};
});
app.controller('MainCtrl', function ($scope) {
$scope.item = {};
$scope.item.status = 'USED';
});
credit to Ilan Frumer
信贷伊兰弗拉姆
#1
13
You would set ng-disabled
to a scope variable, ex:
您将把ng禁用设置为范围变量,例如:
<input ng-disabled="isDisabled" />
And then inside your directive you can set that variable:
然后在你的指令中你可以设置这个变量:
$scope.isDisabled = true;
#2
13
if (statusName === 'USED') {
$attrs.$set('disabled', 'disabled');
} else {
$elm.removeAttr('disabled');
}
Why invoke ng-disable at all? You're already once evaluating the condition yourself, so having ng-disable evaluating it again is redundant.
为什么要调用ng-disable ?你已经自己评估了一次条件,所以让ng-disable评估再次评估是多余的。
#3
4
//html
<div ng-app="miniapp" ng-controller="MainCtrl">
<input type="submit" mydir>
</div>
//js
'use strict';
var app = angular.module('miniapp', []);
app.directive('mydir', function ($compile) {
return {
priority:1001, // compiles first
terminal:true, // prevent lower priority directives to compile after it
compile: function(el) {
el.removeAttr('mydir'); // necessary to avoid infinite compile loop
return function(scope){
var status = scope.item.status
if (status === 'USED') {
el.attr('ng-disabled',true);
} else {
el.attr('ng-disabled',false);
}
var fn = $compile(el);
fn(scope);
};
}
};
});
app.controller('MainCtrl', function ($scope) {
$scope.item = {};
$scope.item.status = 'USED';
});
credit to Ilan Frumer
信贷伊兰弗拉姆