Javascript angular.js层次模型：孙子不工作

我正试着了解一点。特别是，我想创建一个分层数据结构，可以使用分层视图进行操作：

Root:
  - addChild
  - child 1: { remove, addChild, child1, child2, ...}
  - child 2: { remove, addChild, child1, child2, ...}
  ....

（实际代码在）

目前，我试图在两个层次上停止，即根有子和孙

孙辈的“删除”按钮会触发

child.remove（孙辈）

功能。但是，删除元素不会导致删除行：(

我不明白为什么。最重要的是，提琴上的例子似乎一次增加了4个孙子

有关守则：

function Controller($scope) {
    $scope.nextChildIndex = 1;
    $scope.addChild = function () {
        $scope.children.push(makeChild($scope.nextChildIndex++));
    };
    $scope.removeChild = function (child) {
        $scope.children.remove(child);
    };
    $scope.children = [];
}

var makeChild = function (i) {
    var nextIndex = 1;
    var ret = {
        index: i,
        children: []
    };
    ret.addChild = function () {
        ret.children = makeChild(nextIndex++);
    };
    ret.removeChild = function (child) {
        ret.children.remove(child);
    };
    return ret;
};

相关html：

    <ul ng-repeat="grandchild in child.children">
        <li class="grandchild">
            <button ng-click="child.removeChild(grandchild)">-grandchild</button>
            <span>child {{grandchild.index}}</span>
        </li>
    </ul>

-孙子
子{{孙子索引}

---

问：这个

makeChild

函数有什么错，以至于一个

ng click=“addChild（）”

调用一次添加4个

li

元素，并且

ng click=“child.removeChild（孙子）”

不会导致孙子被删除？

您的问题不在AngularJS中

Array.prototype.remove出错

应该是

Array.prototype.remove = function (element) {
    var index = this.indexOf(element);
    this.splice(index,1 );
};

更新的fdl-

UPD:

而不是

    ret.children = makeChild(nextIndex++);

你应该这样做

    ret.children.push(makeChild(nextIndex++));

享受；）