如何在 ng-repeat 中将 ng-model 和 ng-checked 一起用于单选按钮
How to use ng-model and ng-checked together for radio buttons, inside ng-repeat
我正在尝试从 url 获取角色数据 (JSON) 并使用 ng-repeat 将其分配给单选按钮(显示角色列表)并在模式中显示。必须为当前分配给用户的角色选择任何一个选项。
当用户更改选择并单击确定时,应将所选值分配给一个对象,该对象进一步传递给 URL 以更新用户的角色。
如果我使用,
<div ng-repeat="item in roleDataList">
<input type="radio" ng-model="item" ng-checked="item.RoleId==assignedRoleId?true:null" name="RoleRadioButton" ng-value="item" />
<span>{{item.RoleName}}</span>
</div>
然后它默认显示已分配的数据,但我无法访问所选数据,
如果我使用,
<div ng-repeat="item in roleDataList">
<input type="radio" ng-model="$parent.parentRoleId" ng-checked="item.RoleId==assignedRoleId?true:null" name="RoleRadioButton" ng-value="item" />
<span>{{item.RoleName}}</span>
</div>
然后所选角色在 $parent.parentRoleId
中可用,但未选择默认值。
有什么可以同时实现的帮助吗?
看看这个fiddle 几乎是你想要的
<div ng-controller="Ctrl">
<span ng-repeat="category in categories">
<label class="checkbox" for="{{category.id}}">
<input type="checkbox" ng-model="selection.ids[category.id]" name="group" id="{{category.id}}" />
{{category.name}}
</label>
</span>
<pre ng-bind="selection.ids | json"></pre>
function Ctrl($scope) {
$scope.selection = {
ids: {"50d5ad": true}
};
$scope.categories = [ { "name": "Sport", "id": "50d5ad" } , {"name": "General", "id": "678ffr" } ];
}
我正在尝试从 url 获取角色数据 (JSON) 并使用 ng-repeat 将其分配给单选按钮(显示角色列表)并在模式中显示。必须为当前分配给用户的角色选择任何一个选项。
当用户更改选择并单击确定时,应将所选值分配给一个对象,该对象进一步传递给 URL 以更新用户的角色。
如果我使用,
<div ng-repeat="item in roleDataList">
<input type="radio" ng-model="item" ng-checked="item.RoleId==assignedRoleId?true:null" name="RoleRadioButton" ng-value="item" />
<span>{{item.RoleName}}</span>
</div>
然后它默认显示已分配的数据,但我无法访问所选数据,
如果我使用,
<div ng-repeat="item in roleDataList">
<input type="radio" ng-model="$parent.parentRoleId" ng-checked="item.RoleId==assignedRoleId?true:null" name="RoleRadioButton" ng-value="item" />
<span>{{item.RoleName}}</span>
</div>
然后所选角色在 $parent.parentRoleId
中可用,但未选择默认值。
有什么可以同时实现的帮助吗?
看看这个fiddle 几乎是你想要的
<div ng-controller="Ctrl">
<span ng-repeat="category in categories">
<label class="checkbox" for="{{category.id}}">
<input type="checkbox" ng-model="selection.ids[category.id]" name="group" id="{{category.id}}" />
{{category.name}}
</label>
</span>
<pre ng-bind="selection.ids | json"></pre>
function Ctrl($scope) {
$scope.selection = {
ids: {"50d5ad": true}
};
$scope.categories = [ { "name": "Sport", "id": "50d5ad" } , {"name": "General", "id": "678ffr" } ];
}