2

私のボタンのインスタンス化はここにあります:

<button ng-hide="todo === 'add'" confirm-click ng-click="delete()">Delete</button>

私のディレクティブコードは次のとおりです。

(function(app) {
    app.directive('confirmClick', function(){
        return {
            restrict: 'A',
            priority: 1,
            terminal: true,
            link: function(scope, element, attr) {
                var msg = attr.confirmationNeeded || "Really Delete?";
                var clickAction = attr.ngClick;
                element.bind('click', function() {
                    if(window.confirm(msg)){
                        scope.$apply(clickAction);
                    }
                });
            }
        }; 
    });
}(angular.module('case1')));

ボタンからディレクティブを削除すると ng-hide が機能し、ディレクティブを含めると機能しなくなります。ディレクティブを含めると、 $scope.todo 変数がスコープ外にあると思いますが、これを修正するにはどうすればよいでしょうか?

4

2 に答える 2

3

ここで重要なのはterminal:true、ng-hide の実行が発生しない原因です。表示されている動作を引き起こしているのは、優先度だけではありません。

terminal - true に設定すると、現在の優先度が実行されるディレクティブの最後のセットになります (同じ優先度での実行順序が定義されていないため、現在の優先度のディレクティブは引き続き実行されます)。

優先度 0 の ng-hide の後にディレクティブを実行させます。ディレクティブに端末オプションがあるため、ディレクティブの優先度が 1 で ng-hide の方が低いため、ng-hide の実行がスキップされます。

試す： -

return {
        restrict: 'A',
        terminal: true,
        link: function(scope, element, attr) {
            var msg = attr.confirmationNeeded || "Really Delete?";
            var clickAction = attr.ngClick;
            element.bind('click', function() {
                if(window.confirm(msg)){
                    scope.$apply(clickAction);
                }
            });
    }

デモ

またはterminal、本当に必要でない限り、ディレクティブからオプションを削除するだけです。このオプションが存在する場合、Angular はその後にある要素のすべてのディレクティブをスキップするように指示されます (優先度が低くなります)。

于 2014-09-21T16:44:55.590 に答える
2

これはpriority: 1、ディレクティブ定義のプロパティが原因です。

ドキュメントから：

優先順位

1 つの DOM 要素に複数のディレクティブが定義されている場合、ディレクティブが適用される順序を指定する必要がある場合があります。優先度は、コンパイル関数が呼び出される前にディレクティブをソートするために使用されます。優先度は数値で定義されます。数値の優先度が高いディレクティブが最初にコンパイルされます。リンク前の機能も優先順に実行されますが、リンク後の機能は逆の順序で実行されます。同じ優先度のディレクティブの順序は定義されていません。デフォルトの優先度は 0 です。

ngHide のソースから、priorityレベルが設定されていないことがわかるため、デフォルトで 0 になります。ディレクティブの優先度を 1 に設定すると、Angular に最初にコンパイルさせることになります。

優先度を 0 に設定するか、プロパティを省略してデフォルトの 0 にします。

于 2014-09-21T16:44:33.583 に答える