javascript - Angular - 将复选框从 ng-repeat 绑定(bind)到 ng-model

标签 javascript angularjs

我从某个资源返回了一些数据,如下所示:

$scope.phones = [
    {
        Value: <some value>,
        IsDefault: true
    },
    {
        Value: <some value>
        IsDefault: false
    }
];

为了简单起见,这是中继器:

<div ng-repeat="phone in phones">
    <input type="radio" name="phone" ng-model="phone.IsDefault" />
</div>

我希望检查哪个 radio 来相应地更新模型 - 这没有发生。页面加载时,不会检查任何内容。我可以使用 ng-checked - 但没有 ng-model 它不会绑定(bind)回数组。我是否遗漏了一些简单的东西,或者我是否坚持编写 ng-change 事件来手动更新数组?

到目前为止,我还编写了一个 ng-change 事件,它目前看起来像:

ng-model="phone.IsDefault" ng-value="true" ng-change="newPhoneSelected($index)"

$scope.newPhoneSelected = function (index) {
    for (var i = 0; i < $scope.phones.length; i++) {
        if (i == index) $scope.phones[i].IsDefault = true;
        else $scope.phones[i].IsDefault = false;
    }
}

最佳答案

您缺少ng-value...这是单选按钮,它们基于value来将值标记为选定。您需要 [value=""| ng-value=""]

<input type="radio"
       ng-model=""
       [value="" |
       ng-value=""]>

喜欢:

 <input type="radio" ng-value="true" name="boolean" ng-model="myValue" /> True
 <input type="radio" ng-value="false" name="boolean"  ng-model="myValue" /> False 

这是一个plunker demo

或者使用字符串值:

$scope.myValue = 'Car'

html

 <input type="radio" ng-value="'Car'" name="string1" ng-model="myValue" /> Car
 <input type="radio" ng-value="'Airplane'" name="string1"  ng-model="myValue" /> Airplane 

这是second demo

这可能是最接近您所拥有的示例:

http://jsfiddle.net/JbMuD/

关于javascript - Angular - 将复选框从 ng-repeat 绑定(bind)到 ng-model,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23817649/

相关文章:

javascript - 在javascript中通过类名选择元素

javascript - ckeditor 更改段落元素生成的输出

javascript - 有条件的 Angular ui 路由器 View

javascript - Grunt livereload (grunt watch) 不使用 Apache 和 Symfony2

html - 使用 ngClass 时 CSS 样式不适用

javascript - 你如何通过在 state.go 的末尾连接一个 ID 来改变状态?

javascript - 为什么即使在编写 setState 方法后我的状态也没有更新?

javascript - React Native软件如何更新详解

javascript - 如何将数据从 Python 脚本发送到 JavaScript,反之亦然?

javascript - php 文件上的安全 angularjs 代码 ajax 请求