Javascript 动态分配ng模型

我试图从对象数组生成一组复选框。我的目标是让复选框动态地将它们的ng模型映射到将提交到数组中的新对象的属性

我想的是

<li ng-repeat="item in items">
    <label>{{item.name}}</label>
    <input type="checkbox" ng-model="newObject.{{item.name}}">
</li>

{{item.name}

在这个JSFIDLE上可以看到，这不起作用：

---

有人能帮忙吗？

这会给你带来想要的结果：

<input type="checkbox" ng-model="newObject[item.name]">

下面是一个工作提示：

编辑 正如在注释中正确指出的，使用此和ng变更要求事先提供“虚拟”ng模型。然而，应当指出，显然，在1.3中，框架提供了所需的选项。请在下面查看！ /EDIT

如果您和我一样，在执行更复杂的任务时遇到了一个简单的问题，这就是我提出的将任意表达式动态绑定到ng模型的解决方案：

方法：我创建了一个指令dynamicModel，它接受一个标准的角度表达式，对其求值，并通过ng model和$compile将结果链接到范围

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.data = {};
  $scope.testvalue = 'data.foo';
  $scope.eval = $scope.$eval;
});

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.data = {};
  $scope.testvalue = 'data.foo';
  $scope.eval = $scope.$eval;
});

app.directive('dynamicModel', ['$compile', function ($compile) {
    return {
        'link': function(scope, element, attrs) {
            scope.$watch(attrs.dynamicModel, function(dynamicModel) {
                if (attrs.ngModel == dynamicModel || !dynamicModel) return;

                element.attr('ng-model', dynamicModel);
                if (dynamicModel == '') {
                    element.removeAttr('ng-model');
                }

                // Unbind all previous event handlers, this is 
                // necessary to remove previously linked models.
                element.unbind();
                $compile(element)(scope);
            });
        }
    };
}]);

用法是dynamic model=“angularpression”，其中angularpression生成一个字符串，用作ng模型的表达式

我希望这能让人省去不得不想出这个解决方案的头疼

问候,，

---

Justus

对于Angular 1.3，您可以使用

ng model options

指令动态指定模型，或绑定到表达式

下面是一个例子：

---

有关

ngModelOptions

的更多信息，请参见：

这是我支持更深层表达的方法，例如“model.level1.level2.value”

<input class="form-control" ng-model="Utility.safePath(model, item.modelPath).value">

其中item.modelPath='level1.level2'和 实用程序（model，“level1.level2”）是返回model.level1.level2的实用程序函数

人物{{$index+1}*
拯救
var-app=angular.module（'myApp'，[]）；
应用程序控制器（'myCtrl'，函数（$scope）{
$scope.price=[]；
$scope.submitPriceForm=函数（）{
//对象应该类似于$scope.price=[{person1:value}，{person2:value}….]
console.log（$scope.price）；
}
});

hmm实际上这确实给了我“”，这是我缺少的吗？嗯，很奇怪，刚刚添加了一个实例（plunker，因为某种原因，JSFIDLE今天不在我这边工作）。啊，是的，我习惯用php思考，希望实际的标记更改为名称，这很有效。谢谢！太棒了，正是我想要的。我喜欢有棱角的！它在Angular 2中也非常有效。但是多维对象也有解决方案吗？在您的示例中，如果

item.name

有时应该指向

newObject['x']

，有时应该指向

newObject['x']['y']

。您是一个救生员。在找到这篇文章之前，我几乎绝望了。你能说得更具体些吗，布莱恩？你尝试了什么？发生了什么？这是一个解决方案。你帮我解决了一个棘手的问题-谢谢！ng更改不适用于此。如果查看角度源，ngChange指令将ngModel作为必需指令。快速搜索显示只有ngChange和ngList存在此问题。所有其他指令似乎都将ngModel作为可选控制器。我通过使用dynamicmodel指令向任何元素添加ng model=“dummyValue”来解决这个问题。由于对动态模型的更改调用$compile，因此使用ng模型值的ngChange和任何其他指令都会正确更新。当您不需要观察动态模型值的更改时，这是一个更健壮的解决方案-如果我遗漏了什么，请原谅，但您的plunk中似乎没有包含动态模型分配。关于ngModelOptions的任何内容显然都不支持这一点。你能澄清一下吗？因为如果它确实是这样工作的话，它将非常有用…@XMLilley“getterSetter:boolean value，它决定是否将绑定到ngModel的函数视为getter/setter。”感谢Rob提醒我注意这一点，我已经更新了我的答案并链接到了你的答案。你能详细介绍一下这是如何工作的吗？Utility.safePath返回什么以便您可以使用.value？Utility.safePath返回路径字符串指定的嵌套变量的值。e、 g.level1.level2指的是model.level1.level2。

<input class="form-control" ng-model="Utility.safePath(model, item.modelPath).value">