Question

我试图从子元素访问directive scope，触发测试功能，但它不起作用。

HTML

<div my-directive>

     <div ng-click="triggerFromDirective('hello')">Click me</div>

</div>

指令

.directive('myDirective', function() {

      return {
          scope: {},
          controller: function($scope) {

              // This function doesn't fire when click on the 
              // element
              $scope.triggerFromDirective = function(msg) {
                   alert(msg);
              }
          }
      }
});

是否可以通过这种方式触发指令的功能？如果不是，你是如何做到的？

Answer 1

我相信，正如New Dev所说，范围正在混淆。指令div中的代码不会自动添加到指令中。我不是100％确定你的目标是什么，但通常使用模板将HTML添加到指令中。该模板可以访问指令范围。

您还可以查看ngTransclude。

请点击此处查看示例http://jsfiddle.net/8Lbrsw35/。这是代码：

<body>
    <div ng-app="app">
        <div my-directive></div>
    </div>
</body>

JS

app.directive('myDirective', function(){
    return {
        restrict: 'AE',
        scope: {},
        template: '<div ng-click="triggerFromDirective(\'hello\')">Click me</div>',
        controller: function($scope){
            $scope.triggerFromDirective = function(msg) {
               alert(msg);
        };
    }
};

}）;

从子元素访问范围指令

1 个答案: