1. ホーム
  2. javascript

[解決済み] ng-clickで確認ダイアログ - AngularJS

2023-05-24 18:56:47

質問

の確認ダイアログを設定しようとしています。 ng-click に確認ダイアログを設定しようとしています。

app.directive('ngConfirmClick', [
    function(){
        return {
            priority: 1,
            terminal: true,
            link: function (scope, element, attr) {
                var msg = attr.ngConfirmClick || "Are you sure?";
                var clickAction = attr.ngClick;
                element.bind('click',function (event) {
                    if ( window.confirm(msg) ) {
                        scope.$eval(clickAction)
                    }
                });
            }
        };
}])

これはとてもうまくいくのですが、残念ながら、私のディレクティブを使ったタグの中の式は評価されないのです。

<button ng-click="sayHi()" ng-confirm-click="Would you like to say hi?">Say hi to {{ name }}</button>

(のようになります(この場合、nameは評価されません)。ディレクティブのターミナルパラメータが原因だと思われます。何か回避策はないでしょうか?

私のコードをテストするために http://plnkr.co/edit/EHmRpfwsgSfEFVMgRLgj?p=preview

どのように解決するのですか?

を使わなくてもいいのであれば ng-click を使わなくても構わないのであれば、それは問題なく動作します。他の名前に変更するだけで、属性を読み取ることができ、現在あるクリックハンドラが2回トリガーされる問題を回避することができます。

http://plnkr.co/edit/YWr6o2?p=preview

この問題は terminal が他のディレクティブを実行しないように指示していることです。でのデータバインディング {{ }} は、単に ng-bind ディレクティブの別名で、おそらく terminal .