指令調用之前的角度禁用

我在AngularJS應用程序中遇到了一些挑戰。我有一個用戶可以填寫的表單。當他們提交時，我從Bower下載的指令接管，在後臺執行POST，然後返回到我的範圍函數完成。我需要禁用點擊按鈕，並在點擊提交按鈕時顯示加載img。通常情況下，在範圍設置的「更新」變量將照顧這：指令調用之前的角度禁用

<input data-ng-disabled="form.isUpdating" type="submit" value="Submit"/> 
    <img data-ng-show="form.isUpdating" src="/images/spinner.gif"> 

    $scope.saveForm = function(){ 
     $scope.form.isUpdating = true; 
     // Do some stuff 
     $scope.form.isUpdating = false; 
    }

我的問題是，我沒有在什麼最初發生的控制，因爲該指令接管，它沒有訪問我的範圍。我可能會混淆代碼，但是如果我不必這樣做，我寧願不要。所以當我點擊按鈕提交時，直到指令中的POST完成後纔會發生任何事情，這對我的用戶不利。

我不能做ng-click並在那裏設置form.isUpdating爲true，因爲那會立即使按鈕被禁用，所以點擊不會註冊。據我所知，你不能一起使用ng-click和ng-disabled。

任何人都可以想出一個很好的方法來解決這個問題嗎？

來源

2014-09-30 KJ3

我沒有看到使用ng-click的任何問題。您是否使用ng-click面對任何問題，然後在ng-click上點擊按鈕？ – Rabi 2014-09-30 05:49:31

是的，從我讀過（並經歷過）使用ng-click設置變量的設置開始，因此將form.isUpdating設置爲true將立即禁用表單，因此該按鈕被禁用，img在那裏，但沒有其他觸發。 – KJ3 2014-09-30 05:50:55

你如何配置/設置此第三方指令？ ngMousedown將成爲mousedown，mouseup，click，submit事件序列中的第一個事件。你可以包裝ngsubmit嗎？ – cbayram 2014-09-30 06:26:47

做你需要完成異步的東西。這會將其排除在當前的摘要週期之外。是這樣的：

$scope.saveForm = function(){ 
    $scope.form.isUpdating = true; 
    $timeout(function() { 
     //this will run outside the current 
     //digest cycle, so the UI has a change of updating 
     // while I'm working! 
     // Do some stuff 
     $scope.form.isUpdating = false; 
    },0) 
}

希望這對你有所幫助！

來源

2014-09-30 05:49:03

這很好，但問題是，在saveForm函數被觸發之前，花費時間的代碼正在執行。在進入saveForm函數之前，我需要設置isUpdating。 – KJ3 2014-09-30 06:02:41

你的代碼似乎表明saveForm函數是curlpit。你可以建立一個演示你的問題的plunk /小提琴，我可以幫助！ – 2014-09-30 06:23:43

創建一個使用我的代碼的按鈕，並通過代碼觸發提交，我認爲這是解決問題的最簡單方法。 – 2014-09-30 11:40:42

指令調用之前的角度禁用

回答

相關問題