将parent $ scope绑定到按需创建的元素中的ng-repeat

时间:2014-03-18 16:36:57

标签: javascript jquery angularjs angularjs-ng-repeat

因此,我试图创建一个具有多个子集合的集合obj(模型)(并且每个子集合都有其他子集合),并且必须按需添加它们(单击按钮)。

我目前的代码是:

HTML:

    <div ng-controller="mainCtrl">
    <button ng-click="addSubCol()">ADD SUBCOL</button>
<div ng-repeat="subcollection in collection.subcollections">
    <input type="text" value="{{subcollection.name}}">
    <span>COLLECTION OBJ SUBCOL TITLE: {{collection.subcollections[$index].name}}</span>
</div>
</div>

和JS:

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

function mainCtrl($scope) {
    $scope.collection = {};
    $scope.collection.subcollections = [{name:'TEST1'}];

    $scope.addSubCol = function(){
        var subcollection = {
            name: 'TEST',
            otherSubCol: []
        }
        $scope.collection.subcollections.push(subcollection);
    };
}

这个小提琴(http://jsfiddle.net/xznjs/2/)显示了手头的问题。预期的结果是按需创建的新子集合被绑定到父集合。

感谢任何帮助。

1 个答案:

答案 0 :(得分:0)

更改输入以使用ng-model属性。像这样

<input type="text" data-ng-model="subcollection.name">

JS Fiddle