Question

我有两个指令，我想要计算父亲标签中有多少儿子并在index.html中显示计数器，如JS文件后所示，问题是我没有正确获取数字

   module.directive('directiveFather', function () {

    return {

    restrict: 'E',
    scope: {},
    controller: function ($scope) {

        $scope.AllCounter = 0;

        this.addCounter = function () {

            $scope.AllCounter = $scope.AllCounter + 1;

        }

    }


}

}）

  module.directive('directiveSon', function () {

return {

    restrict: 'E',
    scope: {},
    require: '^directiveFather',
    link: function(scope, element, attrs, fatherCtrl){
      fatherCtrl.addCounter();
     }
    }


}

}）

<directive father>

 <directive son>

 </directive son>
 {{AllCounter}}

 </directive father>

Answer 1

如果使用隔离范围，那么directiveFather内的元素将绑定到父范围（因此AllCounter不会在视图中直接可用 - 尽管它将保留正确的价值）。

您可以在scope: {}中将scope: true/false更改为directiveFather（请参阅demo 1）或
＆＃34;手动＆＃34;编译，链接并将HTML附加到directiveFather元素（请参阅demo 2）（还有Wildhoney's suggestion使用翻译和template。）

<子> 基本上，你不需要任何一种方法来工作 - 它们只需要证明一切正常（通过在视图中显示计数器），但即使没有附加计数器，addChild()函数按预期调用。

也就是说，在修复了元素名称（<directive-father>和<directive-son>）之后，它按预期工作。

另请参阅以下简短演示： demo 1 ， demo 2 。

使用其他指令的指令 - AngularJS

1 个答案: