Question

我发现的所有示例都显示了一些单选按钮组是由项目循环中的项目构建的，但它们都没有显示对angularjs控制器中单选按钮组数组的简单访问。我需要做的是遍历按钮组数组，看看它们中是否有任何状态。

var radioSelected = false;

for(var i =0; i < items.length; i++) {
  if(items[i].selected) {
     radioSelected = true;
  }
}

我已经尝试绑定到ng-model并访问它..我尝试过使用$ scope.ButtonGroupName Nothing是一个我可以用循环遍历的数组。关于如何做到这一点的任何建议非常简单的活动将非常感激。

爱被迫重新学习网络开发，因为有人爆发了新的光泽锤。

Answer 1

您不会遍历DOM元素。您将对所有无线电元素使用相同的ng模型，并且每当您更改单选按钮的选定状态时都会更新。

<input type="radio" ng-model="assignedValue" name="myRadio" value="one">
<input type="radio" ng-model="assignedValue" name="myRadio" value="two">
<input type="radio" ng-model="assignedValue" name="myRadio" value="three">

您需要$watch $scope.assignedValue进行更改，而不是遍历DOM元素。

$scope.$watch('assignedValue', function (newValue, oldValue) {
  ..do stuff here
});

请参阅此处了解文档：https://docs.angularjs.org/api/ng/input/input%5Bradio%5D

您不遍历DOM的原因是它不断变化。 Angular的重点在于处理数据，而不是元素本身。

更新：根据您的评论，如果选择了单选按钮，则听起来只想执行操作。

首先，单选按钮应始终具有选定状态。我们假装它不会。您可以通过几种方式启用/禁用/显示/隐藏角度元素，而无需编写其他DOM操作代码。

以上面的示例为例，只有assignedValue为two时才会启用此按钮。

<button ng-disabled="assignedValue != 'two'">My button</button>

您还可以使用ng-if有条件地包含内容：

<div ng-if="assignedValue == 'two'>
  My conditional content
</div>

这也适用于ng-switch

<div ng-switch on="assignedValue">
    <div ng-switch-when="two">My additional content</div>

    <div ng-switch-default>Here's switch fallback content</div>
</div>

我需要访问angularjs中的单选按钮数组

1 个答案: