如何使用 ng-repeat 在 angularjs 中动态禁用单选按钮
how to disable radio button dynamically in angularjs using ng-repeat
我在 Angular JS 中开发了一些代码,我需要根据之前的选择或文本框中的更改禁用单选按钮
在 JS 控制器中:
PPCO.cusGender = [ {
id : '1',
key : 'Male',
value : 'Male',
disable:false
}, {
id : '2',
key : 'Female',
value : 'Female',
disable:false
}, {
id : '3',
key : 'TG',
value : 'TG',
disable:false
}];
PPCO.changeapplicant = function() {
switch (PPCO.p_SALUTATION.toLowerCase().trim()) {
case 'mrs.':
case 'miss.':angular.forEach(PPCO.cusGender, function(val, key) {
if(val.key != 'Male')
{
val.disable = false;
}
});
break;
}
};
在HTML中:
<input type="text" ng-model="PPCO.changeapplicant" class="color" ng-change="PPCO.changeapplicant()">
<label class="radio" ng-repeat="option in PPCO.cusGender">
<input type="radio" name="gender"
ng-model="PPCO.cusgendername" value="{{option.value}}"
ng-disabled="option.disable">
<i></i>
</label>
我的问题是我可以更改“ng-disabled =true”值,但它不会再次启用。怎么做的
我为这种情况创建了这个 plnkr:https://plnkr.co/edit/F4JZcf6Nm5Csbxbg
我认为您同时发生了 2 个错误:
- 您正在迭代一个数组。所以,你不需要使用
angular.forEach
,你可以使用array.forEach
- 此外,最重要的是,当元素为
mrs.
或 miss.
时,您将设置为 false,这没关系。但是,您不会设置回 true
。所以,你必须包括一个像这样的 else 子句:
if (['mrs.', 'miss.'].includes($scope.applicant.toLowerCase().trim())) {
$scope.cusGender.forEach(function(element) {
element.disable = element.key == 'Male';
});
} else {
$scope.cusGender.forEach(function(element) {
element.disable = false;
});
}
我想就这些了!
我在 Angular JS 中开发了一些代码,我需要根据之前的选择或文本框中的更改禁用单选按钮
在 JS 控制器中:
PPCO.cusGender = [ {
id : '1',
key : 'Male',
value : 'Male',
disable:false
}, {
id : '2',
key : 'Female',
value : 'Female',
disable:false
}, {
id : '3',
key : 'TG',
value : 'TG',
disable:false
}];
PPCO.changeapplicant = function() {
switch (PPCO.p_SALUTATION.toLowerCase().trim()) {
case 'mrs.':
case 'miss.':angular.forEach(PPCO.cusGender, function(val, key) {
if(val.key != 'Male')
{
val.disable = false;
}
});
break;
}
};
在HTML中:
<input type="text" ng-model="PPCO.changeapplicant" class="color" ng-change="PPCO.changeapplicant()">
<label class="radio" ng-repeat="option in PPCO.cusGender">
<input type="radio" name="gender"
ng-model="PPCO.cusgendername" value="{{option.value}}"
ng-disabled="option.disable">
<i></i>
</label>
我的问题是我可以更改“ng-disabled =true”值,但它不会再次启用。怎么做的
我为这种情况创建了这个 plnkr:https://plnkr.co/edit/F4JZcf6Nm5Csbxbg
我认为您同时发生了 2 个错误:
- 您正在迭代一个数组。所以,你不需要使用
angular.forEach
,你可以使用array.forEach
- 此外,最重要的是,当元素为
mrs.
或miss.
时,您将设置为 false,这没关系。但是,您不会设置回true
。所以,你必须包括一个像这样的 else 子句:
if (['mrs.', 'miss.'].includes($scope.applicant.toLowerCase().trim())) {
$scope.cusGender.forEach(function(element) {
element.disable = element.key == 'Male';
});
} else {
$scope.cusGender.forEach(function(element) {
element.disable = false;
});
}
我想就这些了!