1

次のディレクティブがあります。

.directive('confirmOnExit', function () {
    return {link: function ($scope, elem, attrs) {
            window.onbeforeunload = function () {
                if ($scope.contextForm.$dirty) {
                    return "Unsaved data detected.";
                }
            }
        }
    };
})

ご覧のとおり、ディレクティブは form を直接参照するため、あまり適切に記述されていませんcontextForm。

私がやりたかったことは、もう少し一般的なことです (したがって、他のフォームでも使用できます)。

.directive('confirmOnExit', function ($window) {
    return {link: function ($scope, elem, attrs) {
            // Make sure code is only executed if directive is place on a form
            // Should I even do this here??
            if (elem[0].tagName == "FORM") {
                var form = elem[0];
                $window.onbeforeunload = function () {
                if (form.className.indexOf("ng-dirty") > -1) {
                    return "Unsaved data detected.";
                }
            }
        }
    };
})

form.hasClass("ng-dirty")コードがまだかなり醜い、または機能していないことに気付くでしょう...また、アクセスが正しくないform.$dirty()と思います...elem[0]

助けていただければ幸いです。

ありがとう！！

4

2 に答える 2

2

AngularJS フォーム docから:

name 属性が指定されている場合、フォーム コントローラーはこの名前で現在のスコープに発行されます。

$evalしたがって、name属性を使用してそのコントローラーにアクセスできます。

.directive('confirmOnExit', function () {
    return {
        link: function ($scope, elem, attrs) {
            var formCtrl = $scope.$eval(attrs.name);
            window.onbeforeunload = function () {
                if (formCtrl.$dirty) {
                    return "Unsaved data detected.";
                }
            }
        }
    };
});
于 2013-06-07T10:59:22.190 に答える
2

FormController に依存する必要があります ( http://docs.angularjs.org/api/ng.directive:form.FormController )

だからあなたができること：

  1. require: '^ngForm'"リンク機能へのパラメーターとしてリクエストフォームコントローラーに " を追加します
  2. リンク関数に別のパラメーターを追加します (種類formCtrl)
  3. 使用するformCtrl.$dirty

明確でない場合は、ディレクティブを使用して plunker の例を作成してください。これらの変更を加えてみます。

于 2013-06-07T10:24:37.457 に答える