Winkeldaten sind nicht bindend in $ http.post Erfolgsmethode

Question

Ich fand ein seltsames Problem während der Arbeit in angular js Ich bekomme Daten mit Ajax Anruf. Ich Bindungsdaten zu $ ​​scope Objekt, sondern Ansicht wird nicht immer aktualisiert, nachdem die Daten folgende binden, ist mein Code

$scope.getPlanDetail = function(){ 

    $rootScope.planBody.checkUpdate= false; 
    $http.post('http://MyServerURL',JSON.stringify($rootScope.planBody)). 
      success(function(response){ 
       $scope.dataVal = response;//Able to view data in console; 
       console.log($scope.dataVal)//data json shown in log window 
       localStorage.setItem("tempDataVal", JSON.stringify(response));//able to set data in localStorage; 
      } 
    } 

---

getPlanDetail() Funktion auf BTN Klick aufgerufen wird immer mit ng Sie auf

Die gleiche Funktionalität habe ich in anderen Fällen (mit get Methode.), Wo Code richtig funktioniert. Der einzige diff fand ich, dass aktuelle AJAX-Aufruf wegen zu viel von serverseitigen Verarbeitung und seine post-Methode zu viel Zeit nimmt Ich bin nicht sicher, ob diese (mit post-Methode) Problem verursacht in Bindung

In derselben Ansicht (.html) habe ich Dummy Button ng-click event hinzugefügt. Nach einem AJAX-Erfolgsaufruf klicke ich auf die Schaltfläche und die Ansicht wird geladen, da die Daten von der localStorage-Variable verwendet werden.

$scope.dummyClick= function(){ 
    console.log($scope.dataVal);//giving Undefined 
    $scope.dataVal = JSON.parse(localStorage.getItem("tempDataVal"));// this time view binded properly. 
} 

Ich habe nicht verstanden, warum Daten nicht in der Erfolgsmethode angezeigt werden. Wird der $ scope nach einiger Zeit deaktiviert, wenn der Server zu viel Zeit braucht, um zu antworten?

Vielen Dank im Voraus.

Answer 1

Wenn Sie das Modell innerhalb eines Ajax-Aufrufs ändern, müssen Sie dem angularen js mitteilen, dass Sie einige Änderungen vorgenommen haben.

$ scope. $ Apply(); Nach der unteren Zeile wird Ihr Problem behoben. Diese Zeile aktualisiert den Bereich.

$ scope.dataVal = Antwort;

Danke,

Santyy