anglejsディレクティブの実行時制御のイベントがトリガーされない

Question

AngularJSを使用してディレクティブを作成しました。このディレクティブは、実行時（動的）コントロールを表示しますが、コントローラからイベントをトリガーしていません。誰でも私を助けることができます。

注：指示文でもコンパイルに使用されます。

plnkrのリンクを以下に示します。

module.controller('controllerOne', ['$scope', function ($scope) { 


    $scope.AddClickButton = function() { 
     alert("Button Clicked"); 
    }; 


}]); 

module.directive('directiveOne', ['$compile', function ($compile) { 
    return { 
     restrict: 'E', 

     scope: { 

      data: '=' 
     }, 

     link: function ($scope, $element, $attrs) { 

      var btnhtml = '<button type="button" ng-click="AddClickButton()">Click Me</button>'; 
      var temp = $compile(btnhtml)($scope); 

      $element.append(temp); 

     } 
    }; 
}]); 

HTML

<form name="form1" > 

    <directive-one data="dataOne"></directive-one> 

</form> 

Plunkr

Answer 1

あなたはディレクティブは、単離されたスコープを使用してきたように&（式結合）を使用してディレクティブにAddClickButtonメソッド参照を通過しなければなりません。したがって、親のスコープについては直接的にはわかりません。その後、

マークアップ

<form name="form1" > 

<directive-one data="dataOne" click-action="AddClickButton()"></directive-one> 

そしてclickAction isoaltedという範囲の小道具を使用してディレクティブからそのメソッドを呼び出します。

指令

module.directive('directiveOne', ['$compile', function($compile) { 
    return { 
    restrict: 'E', 

    scope: { 
     data: '=', 
     clickAction: '&' 
    }, 
    link: function($scope, $element, $attrs) { 
     var btnhtml = '<button type="button" ng-click="clickAction()">Click Me</button>'; 
     var temp = $compile(btnhtml)($scope); 
     $element.append(temp); 
    } 
    }; 
}]); 

Forked Plunkr

Answer 2

あなたはhttp://plnkr.co/edit/9QCpAQUhOKZ3NtU1rfhY

link: function ($scope, $element, $attrs) { 
     $scope.AddClickButton = function() { 
     alert($scope.text); 
     } 
    } 

このバージョンを使用して、コントローラ