指令內部形式，而移動到使用Angular.js

Question

我有一個問題必須這兒過得在我的應用形式，我的要求是當用戶瀏覽到另一個頁面，而不提交此表一個確認信息將另一個頁面無法正常工作顯示警告用戶使用angular.js.我在下面解釋我的代碼。

<form name="billdata" id="billdata" confirm-on-exit enctype="multipart/form-data" novalidate> 
    <span class="input-group-addon ndrftextwidth text-right" style="width: 180px;">First Name :</span> 
    <input type="text" name="itemname" id="contactno" class="form-control" placeholder="user Name" ng-model="first_name"> 
    <span class="input-group-addon ndrftextwidth text-right" style="width: 180px;">Last Name :</span> 
    <input type="text" name="itemname" id="contactno" class="form-control" placeholder="user Name" ng-model="last_name"> 
    <div style="text-align: center; padding-top: 10px;"> 
     <input type="button" class="btn btn-success" ng-click="addUserData(billdata);" id="addProfileData" value="submit" /> 
    </div> 
</form> 

而我在我的控制器頁面中有以下代碼。

dashboard.directive('confirmOnExit', function() { 
    return { 
      link: function($scope, elem, attrs) { 
       window.onbeforeunload = function(){ 
        if ($scope.billdata.$dirty) { 
         return "The form is not saved, do you want to stay on the page?"; 
        } 
       } 
       $scope.$on('$locationChangeStart', function(event, next, current) { 
        if ($scope.billdata.$dirty) { 
         console.log('next',next,current); 
         if(!confirm("The form is not saved, do you want to stay on the page?")) { 
          event.preventDefault(); 
         }else{ 
          console.log('hii'); 
         } 
        } 
       }); 
      } 
     }; 
}); 

這裏我得到確認消息時，用戶完全離開頁面site.But我的要求是當用戶瀏覽到另一個頁面，而不提交這種形式的確認消息應該display.Please幫助我。

Answer 1

好了，所以我創建了一個小的項目有兩個途徑。演示如何做你想要的東西...這是你的代碼段這樣剛剛從它採取什麼你需要

該指令已被更改爲：

.directive('confirmOnExit', function() { 
return { 
    require:'form', 
     link: function($scope, elem, attrs,formController) { 
      window.onbeforeunload = function(){ 
       if (formController.$dirty) { 
        return "The form is not saved, do you want to stay on the page?"; 
       } 
      } 
       $scope.$on('$locationChangeStart', function (event, next, current) { 
      if (formController.$dirty) { 
       if (!confirm("The form is dirty, do you want to stay on the page?")) { 
        event.preventDefault(); 
       } 
      } 
     }); 
      } 
    }; 

}）;

不是我添加了需要的形式，使其泛型要使用所有形式。

這隻會考慮$髒的，所以如果你還想$無效添加條件和$提交以及

**這裏是一個** PLUNKER與工作示例...