如何使用 ng-repeat 在 angularjs 中动态禁用单选按钮答案

【问题标题】：how to disable radio button dynamically in angularjs using ng-repeat如何使用 ng-repeat 在 angularjs 中动态禁用单选按钮
【发布时间】：2021-10-25 11:43:32
【问题描述】：

我在 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”值，但它不再启用。如何做到这一点

【问题讨论】：

标签： angularjs radio-button angularjs-scope angularjs-ng-repeat

【解决方案1】：

我为此案例创建了这个 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;
  });        
}

我想就这些了！

【讨论】：