为什么这个函数执行两次?

我有一个树形结构。 JSBIN在这里

在指令中

scope.add_child_task = function() {
    scope.add_task(scope.path,"child of " + scope.member.name);
    if (!scope.has_children) {
        scope.add_children_element();
        scope.has_children = true;
    }
};

在控制器中

$scope.add_task = function(to,name) { 
    DataFactory.add_task(to,name);
};

工厂正在找到正确的位置并添加节点。

当添加一个孩子到有现有孩子的节点时,它会添加两个孩子,我不明白为什么。

谢谢。

编辑我可以失去has_children ,它仍然会产生相同的结果

更新了JSBIN

会员链接functin

link: function (scope, element, attrs) {            

            element.append("<collection></collection>"); 
            $compile(element.contents())(scope);

            scope.get_path = function() { 
                var temp = scope.$parent.get_path();
                temp.push(scope.member.name);
                return temp;
            };
            scope.path = scope.get_path();

            scope.add_child_task = function() {
                scope.add_task(scope.path,"child of " + scope.member.name);
            };
        }

编辑2 Droped for循环 - 只是交换引用,没有任何东西,只是一个函数被执行两次!

更新了JSBIN


你正在编译整个元素(包括已经被编译过的指令模板添加的部分):

element.append("<collection></collection>"); 
$compile(element.contents())(scope);

由于您的点击处理程序位于编译模板的模板中,因此第二次会添加第二组点击处理程序 (以及其他内容)。

template: "<li>{{member.name}}" + 
      " <i>{{path}}</i> <a href ng-click='add_child_task()'>Add Child</a></li>",

修正:相反,使用它只编译你添加的新元素:

newe = angular.element("<collection></collection>");
element.append(newe); 
$compile(newe)(scope);

更新jsbin

链接地址: http://www.djcxy.com/p/17689.html

上一篇: Why is this function executed twice?

下一篇: How to generate sequence of numbers/chars in javascript?