将单选按钮绑定到复杂对象可防止选中
Binding radio button to complex object prevents selected
我将单选按钮绑定到我的模型,如下所示:
<input type="radio" ng-model="formData.style" ng-value="{{style}}">
其中样式是具有多个属性的复杂对象。这是在 ng 重复中完成的,所以我有多个。样式可以是这样的:
{"name":"kran", "size":"2"}
等等..我想将整个对象绑定到模型,以便以后可以将其保存为状态并检索它以继续使用它。但是当我使用保存的"状态"更新模型时,UI 不会更新以显示选择了哪个单选按钮。我相信这与绑定到复杂对象而不是简单值有关,但我不太确定。
样式对象来自另一个数组,如下所示:
<div ng-repeat="style in data.styles">
如何解决此问题?
我的第一个答案有点错误。我在这里做了一个工作示例:
https://jsfiddle.net/lisapfisterer/szp3dudh/
.HTML
<form>
<label>Radio-Buttons</label>
<br/>
<label ng-repeat="style in styles">
<input type="radio" ng-model="formData.style" ng-value="style"> {{style.name}}
</label>
<br/>
</form>
AngularJs
var first = { name: "First Name", value: "First Value" };
var second = { name: "Second Name", value: "Second Value" };
var third = { name: "Third Name", value: "Third Value" };
$scope.styles = [first, second, third];
$scope.formData = {};
$scope.formData.style = $scope.styles[0];
我正在努力获得可接受的答案,我怀疑这是因为ng-repeat创建一个子作用域,因此必须绑定到$parent:
试试这个
.HTML
<form>
<label>Radio-Buttons</label>
<br/>
<label ng-repeat="style in styles">
<input type="radio" ng-model="$parent.formData.style" ng-value="style"> {{style.name}}
</label>
<br/>
相关文章:
- 将代码转换为可重用对象
- 如何在我传递给视图的ViewModel集合中获得jQuery可选对象的值,以作为有序列表进行迭代
- dragcenter/dragleave可防止发射落弹
- 最新typescript编译器版本(0.9.5)中的可索引对象
- 在ko.applyBindings(..)中执行Knockout js订阅函数(用于可观察对象)
- Meteor模板数据对象可防止javascript事件触发
- 模仿`overflow-y:auto;overflow-x:visible `在jQuery UI可排序对象上
- 在javascript(three.js)中使用函数:.load()后,如何防止对象被破坏
- Knockout.js用单个json对象绑定一个可观察对象
- 递归可防止函数在一行中被多次单击
- 父操作可防止在 ember.js 中调用提交操作
- Web Workers-JSON的可传输对象
- 根据某些条件将 JS 绑定到可观察对象内的数组元素
- 动画滚动脚本可防止从外部链接访问本地锚点位置
- Greasemonkey 可防止脚本在 Inernet 出现故障时卡住
- Jquery UI:如何指示可拖动对象成功拖放到可排序对象上
- Jquery 如何指定哪个可丢弃对象应与嵌套的可放置元素一起使用
- 使用可编辑对象进行分组
- 我怎样才能延迟可折叠对象的扩展,直到获取其内容
- 将单选按钮绑定到复杂对象可防止选中