Javascript AngularJS：嵌套循环、数据绑定和基本行为的正确设计

一般来说，我对AngularJS和MVC框架还不熟悉，所以我希望有人能帮上大忙。我有一个用例，其中我有一个对象数组，每个对象都包含一个子对象数组。我需要将顶层对象显示为单选按钮，并将其子对象显示为复选框。我有嵌入ng重复的基本视图渲染，但我需要添加一些简单的行为。其想法是，如果未选中其父项，则子项复选框将被禁用（灰显）。因此，一旦选择了不同的单选按钮，所有其他复选框都将被禁用，其子项除外。我可以在这里插入一些jquery来实现这一点，但我相信这在纯AngularJS中是可能的

HTML:

正如StackOverflow Q&A中所观察到的，您需要让单选按钮更新共享模型，然后您可以根据该模型的状态设置复选框的禁用状态。因此，在控制器中，您可以在设置$scope.org之前添加此行：

$scope.selected = {id: ''};

下一步，更改单选按钮标签，使其如下所示：

<input type="radio" name="temp" ng-model="selected.id" value="{{org.Id}}"/>

最后，将ng disabled指令添加到复选框中：

<input type="checkbox" class="orgCheckbox" ng-disabled="selected.id != org.Id"/>

这应该可以做到

---

编辑：我的原始代码有一个简单的模型值“selectedId”，直接放在$scope上，这当然违反了“在ng模型中始终有一个点”规则，如中所述。现在已更正，因此该选择是一个对象，其中模型值是辅助“id”属性。

感谢您的回复。很接近，但并不完全有效。当我选择其他单选按钮时，复选框不会被禁用。编辑@迈克：谢谢你发现了。我违反了Noob手册中的规定。不管怎么说，这个修正现在起作用了，就像在你的小提琴上测试的那样。太棒了，成功了！感谢您的更正和有效的解决方案。我知道禁用的表单字段不会在表单中提交，但出于好奇，是否可以在选择其他电台时取消选中复选框并禁用它们？别担心，我只是好奇。你已经帮了大忙了！再次感谢！不客气！至于复选框的更改，您可能希望将您的复选框绑定到某种模型，这样您就可以只更改这些模型值以取消选中它们，然后让$watch侦听器通过为不合格的复选框组伪造这些模型值来对“selected.id”更改作出反应。感谢您的指导。我有工作要做，但我不确定它是否最有效，因为它需要嵌入循环。你能想出比这更好的办法吗：

<input type="radio" name="temp" ng-model="selected.id" value="{{org.Id}}"/>

<input type="checkbox" class="orgCheckbox" ng-disabled="selected.id != org.Id"/>