AngularJS - ngrepeat 中的 ngmodel 不更新（'dotted' ngmodel）答案

【问题标题】：AngularJS - ngmodel in ngrepeat not updating ('dotted' ngmodel)AngularJS - ngrepeat 中的 ngmodel 不更新（'dotted' ngmodel）
【发布时间】：2014-10-30 09:32:45
【问题描述】：

我正在尝试用角度数组绘制radioBoxes，然后获取已检查收音机的值，但模型不会改变它的值你，有人可以帮我吗？

HTML 部分

<div ng-app>
    <div ng-controller="CustomCtrl">
        <label ng-repeat="user in users">
            <input type="radio" name="radio" ng-model="radio" value="{{user.name}}" /> {{user.name}} 
        </label>
        <br/>
        {{radio}}
        <br/>
        <a href="javascript:void(0)" ng-click="saveTemplate()">Save</a>
    </div>
</div>

角部分

function CustomCtrl($scope) {
    $scope.radio = "John";
    $scope.users = [
        {"name" : "John", "Year" : 18},
        {"name" : "Tony", "Year" : 19}
    ];

    $scope.saveTemplate = function() {
        console.log($scope.radio);
    };
}

您可以在此处查看示例 - http://jsfiddle.net/hgf37bo0/2/

【问题讨论】：

标签： angularjs scope angular-ngmodel

【解决方案1】：

您需要将$scope.radio 设置为这样的对象：

$scope.radio = {
  name: 'John'
}

然后像这样从 html 访问它：

<input type="radio" name="radio" ng-model="radio.name" value="{{user.name}}" />

这是一个有效的jsfiddle

您可以在answer 中了解为什么需要这样做

来自 angularjs docs:

作用域继承通常很简单，您通常甚至不需要知道它正在发生...直到您尝试将 2 路数据绑定（即表单元素、ng-model）到基元（例如数字, string, boolean) 从子作用域内定义在父作用域上。它不像大多数人期望的那样工作。发生的情况是子作用域获得了自己的属性，该属性隐藏/隐藏了同名的父属性。这不是 AngularJS 正在做的事情——这就是 JavaScript 原型继承的工作原理。

...

有一个“。”在您的模型中将确保原型继承发挥作用。所以，使用

<input type="text" ng-model="someObj.prop1">

而不是

<input type="text" ng-model="prop1">

如果您真的想要/需要使用原语，有两种解决方法：

在子范围内使用 $parent.parentScopeProperty。这将防止子范围从创建自己的属性。定义一个函数父作用域，并从子作用域调用它，传递原语对父级的价值（并非总是可能的）

【讨论】：