Angular $ watch僅在onclick上觸發一次

Question

我在一個包含ajax調用的角度服務中有一個函數，執行以下操作：

function performCall($scope){
   $scope.dataFail = false;

   var promise = doAjaxCall();
   promise.then(function(data){
      if(data.rootElement){
         //process...
      }else{
         $scope.dataFail=true;
      }
   }
}

我的控制器中的$ watch表達式正在查看dataFail，並在確認對話框時顯示一個對話框，其中包含調用performCall的選項：

$scope.$watch('dataFail', function(dataFail){
    if(dataFail){
        //open dialog
        $( "#ajaxFailurePopup" ).dialog({
            zIndex: 3003,
            title: "Note:",
            modal:true, // Disable controls on parent page
            buttons: {
                Ok: {
                    text: 'Retry >',
                    "class" : 'ppButton floatRight',
                    click:
                      function() {
                                             service.performCall($scope);
                         $("#ajaxFailurePopup").remove();
                       }
                    }
                }
            });
        };
    });

當ajax調用首次失敗時，這在初始化時工作正常。 但是，在此之后， $watch不會對dataFail進行任何更改。 有人有什么建議嗎？

Answer 1

通過在$ scope.apply中包含對performCall的調用來解決：

$scope.apply(
   service.performCall($scope);
)

dataFail標志正在performCall方法中設置。 道歉。

Answer 2

您的代碼有幾個問題：

1. 在Angular中，僅當表達式更改了值時才調用$ watch表達式回調函數。 由於您永遠不會重置“dataFail”標志，因此后續調用中永遠不會調用表達式。 您應該在$ watch表達式中將flag變量設置為false。

2. 在對話框中，您調用$（“＃ajaxFailurePopup”）。remove（）; 從DOM中刪除#ajaxFailurePopup元素，因此對話框無法再次初始化。 你應該使用$（'＃ajaxFailurePopup'）。dialog（'destroy'）;

工作plnkr： http ：//embed.plnkr.co/wcooiJ

Answer 3

既然你說手表會在第一個失敗的請求中觸發，但是在后續失敗的請求中沒有，那么你是否可能因為成功的請求而沒有將$scope.dataFail重置$scope.dataFail false？ 如果$scope.dataFail在初始化期間僅設置為false，則該值永遠不會更改，並且不會調用您的監視。 如果已經為真，則將$scope.dataFail設置$scope.dataFail true將不會觸發監視，因為Angular無法判斷它是否已更改。