2

我无法修改由 ng-repeat 生成的文本框。由于父/子范围，它也有点复杂。

链接：http: //jsfiddle.net/tzXn2/

剧本：

function ConfigController($scope)
{
    $scope.config = {"key1":["a","b","c"]};
}
function SettingController($scope)
{
    var configKey = null;
    function update() {
        $scope.items = $scope.config[configKey];
    }
    $scope.init = function(key) {
        configKey = key;
        update();
    };
    $scope.$watch('config', update, true);
}

标记：

<div ng-app ng-controller="ConfigController">
    Config: {{config}}
    <div ng-controller="SettingController" ng-init="init('key1')">
        Items: {{items}}
        <div ng-repeat="item in items">
            <input ng-model="item" type="text"/>
        </div>
    </div>
</div>
4

3 回答 3

2

绑定到对象具有您想要的行为，而不是绑定到基元。

 $scope.config = {"key1":[{value : "a"},{value:"b"},{value : "c"}]};

绑定将是

<div ng-repeat="item in items">
    <input ng-model="item.value" type="text"/>
</div>

以下链接解释了为什么这样做

不要绑定到基元

Artem Andreev 对另一个问题的回答很好地解释了这种行为。复制相关部分：

您的示例“直接绑定到每个元素”如何适用于 AngularJS 1.0.3：

  • 您在输入中输入字母“f”；
  • ngModelController 更改项目范围的模型（名称数组未更改）=> name == 'Samf', names == ['Sam', 'Harry', 'Sally'];
  • $digest 循环开始；
  • ngRepeat 用未更改名称数组 ('Sam') 中的值替换项目范围 ('Samf') 中的模型值；
  • ngModelController 使用实际模型值 ('Sam') 重新呈现输入。
于 2013-08-21T08:25:08.727 回答
1

ng-repeat 绑定为其创建的每个项目创建子范围。在这个子作用域上，您可以从父作用域读取所有类型，但是如果您更改字符串、整数和布尔值等原始类型，它会在子作用域上创建一个新对象，因此更改不会反映在父作用域模型上。

如果您想在 ng-repeat 中使用符号或复杂对象，您应该使用ng-model它。dot就像是

<div ng-repeat="item in items">
            <input ng-model="item.text" type="text"/>
        </div>

其次，您试图更改 ng-repeat 自身绑定的模型。对此的任何更改都将导致 ng-repeat 再次运行，并从父范围重新绑定旧值。

于 2013-08-21T08:25:10.510 回答
1

您需要将您的 ng-model 引用放在一个对象中。我认为 Angular 无法将值存储在数组中。

添加一个$scope.value : {key1: {a: 'a', b: 'b', c: 'c'}}来存储每个字段的值，然后将输入绑定到ng-model="value['key1'][item]"

像这样：http: //jsfiddle.net/tzXn2/3/

顺便说一句，您可以在 init 中仅用一行替换所有更新/监视内容：

$scope.items = $scope.config[key];
于 2013-08-21T08:22:56.060 回答