AngularJSでスコープを分離せずにディレクティブからコントローラー関数を呼び出す

分離スコープを使用せずに、ディレクティブ内から親スコープの関数を呼び出す方法を見つけることができないようです。分離スコープを使用する場合、分離で "＆"を使用して親スコープの関数にアクセスできることを知っていますが、必要がないときに分離スコープを使用すると影響があります。次のHTMLについて考えてみます。

<button ng-hide="hideButton()" confirm="Are you sure?" confirm-action="doIt()">Do It</button>

この簡単な例では、JavaScriptの確認ダイアログを表示し、確認ダイアログで[OK]をクリックした場合にのみdoIt（）を呼び出します。これは、分離されたスコープを使用して簡単です。ディレクティブは次のようになります。

.directive('confirm', function () {
    return {
        restrict: 'A',
        scope: {
            confirm: '@',
            confirmAction: '&'
        },
        link: function (scope, element, attrs) {
            element.bind('click', function (e) {
                if (confirm(scope.confirm)) {
                    scope.confirmAction();
                }
            });
        }
    };
})

しかし問題は、私が分離スコープを使用しているため、上の例のng-hideは親スコープに対して実行されず、分離スコープで実行されることです（ディレクティブで分離スコープを使用すると、その要素のすべてのディレクティブが分離スコープを使用します）。以下は、 ng-hideが機能しない上記の例のjsFiddleです。（このフィドルでは、入力ボックスに「yes」と入力すると、ボタンが非表示になることに注意してください。）

代わりに、分離されたスコープを使用しないこともできます。これは、このディレクティブのスコープを分離する必要がないため、実際にここで本当に必要なものです。私が持っている唯一の問題は、分離されたスコープに渡さない場合、親スコープのメソッドをどのように呼び出すのですか？

これは、孤立スコープを使用していないng-hideのjsfiddleですが、もちろん ng-hideは正常に動作していますが、confirmAction（）の呼び出しは機能せず、動作させる方法がわかりません。

注意してください、私が本当に探している答えは、分離されたスコープを使用せずに外部スコープの関数を呼び出す方法です。また、この確認のポイントは、外部スコープを呼び出す方法を理解し、それでも他のディレクティブを親スコープに対して機能させることができるためです。

または、他のディレクティブがまだ親スコープに対して機能する場合、分離されたスコープを使用するソリューションについて聞いてみたいと思いますが、これは可能ではないと思います。

ディレクティブは関数を呼び出すだけで（プロパティに値を設定しようとはしない）、$ parseの代わりに$ evalを使用できます（分離されていないスコープを使用）。

scope.$apply(function() {
    scope.$eval(attrs.confirmAction);
});

または、単に$ applyを使用するだけで、スコープに対して引数を$ eval（）uateできます。

scope.$apply(attrs.confirmAction);

フィドル

AngularJSで$ parseサービスを利用したいとします。

だからあなたの例では：

.directive('confirm', function ($parse) {
    return {
        restrict: 'A',

        // Child scope, not isolated
        scope : true,
        link: function (scope, element, attrs) {
            element.bind('click', function (e) {
                if (confirm(attrs.confirm)) {
                    scope.$apply(function(){

                        // $parse returns a getter function to be 
                        // executed against an object
                        var fn = $parse(attrs.confirmAction);

                        // In our case, we want to execute the statement in 
                        // confirmAction i.e. 'doIt()' against the scope 
                        // which this directive is bound to, because the 
                        // scope is a child scope, not an isolated scope. 
                        // The prototypical inheritance of scopes will mean 
                        // that it will eventually find a 'doIt' function 
                        // bound against a parent's scope.
                        fn(scope, {$event : e});
                    });
                }
            });
        }
    };
});

$ parseを使用してプロパティを設定する際の問題はありますが、それに到達したら、そのブリッジを渡らせます。

hideButton親スコープを明示的に呼び出します。

ここにフィドルがあります：http : //jsfiddle.net/pXej2/5/

そしてここに更新されたHTMLがあります：

<div ng-app="myModule" ng-controller="myController">
    <input ng-model="showIt"></input>
    <button ng-hide="$parent.hideButton()" confirm="Are you sure?" confirm-action="doIt()">Do It</button>
</div>

私が抱えている唯一の問題は、分離されたスコープで渡さない場合、親スコープでメソッドを呼び出すにはどうすればよいですか？

以下は、孤立したスコープを使用していないng-hideが正常に動作しているjsfiddleですが、もちろん、confirmAction（）の呼び出しは機能せず、機能させる方法がわかりません。

まず小さなポイント：この場合、外部コントローラーのスコープはディレクティブのスコープの親スコープではありません。外部コントローラーのスコープは、ディレクティブのスコープです。つまり、ディレクティブで使用される変数名は、コントローラーのスコープで直接検索されます。

次に、このボタンのattrs.confirmAction()ため、書き込みは機能しませんattrs.confirmAction。

<button ... confirm-action="doIt()">Do It</button>

は文字列"doIt()"です"doIt()"()。たとえば、文字列を呼び出すことはできません。

あなたの質問は本当に：

名前を文字列として持っているときに関数を呼び出すにはどうすればよいですか？

JavaScriptでは、主に次のようにドット表記を使用して関数を呼び出します。

some_obj.greet()

ただし、配列表記を使用することもできます。

some_obj['greet']

インデックス値が文字列であることに注意してください。したがって、ディレクティブでこれを行うことができます：

  link: function (scope, element, attrs) {

    element.bind('click', function (e) {

      if (confirm(attrs.confirm)) {
        var func_str = attrs.confirmAction;
        var func_name = func_str.substring(0, func_str.indexOf('(')); // Or func_str.match(/[^(]+/)[0];
        func_name = func_name.trim();

        console.log(func_name); // => doIt
        scope[func_name]();
      }
    });
  }