Angular Wie man auf Änderungen an einer Scope-Variablen achtet

Question

Ich versuche mein eigenes Cart-System in Angular und Node zu erstellen. Mein Controller behandelt sowohl Benutzerwagen in einer Mongo-Datenbank als auch Wagen im lokalen Speicher (wenn ein Benutzer kein Konto hat). Im Moment habe ich einen Weg für meinen Wagen-Controller geschaffen, um einen Einkaufswagen-Artikel aus dem lokalen Speicher und der Datenbank zu entfernen. Meine eckige Ansicht beobachtet das Objekt.

$scope.lineItems 

Zum Bestücken des Einkaufswagens mit Artikeln. Im Moment kann ich den aktualisierten Einkaufswagen erfolgreich erhalten, aber ich muss meine Seite aktualisieren. Was wäre der beste Weg, um den Gültigkeitsbereich zu aktualisieren, indem eine Funktion ausgelöst wird, die den Gültigkeitsbereich aktualisiert?

Code:

if (token) { 
    var payload = authService.parseToken(token); 
    dataService.getCart(payload._id).then(function (resolve){ 
     if (resolve.data){ 
     $scope.lineItems = resolve.data; 

     $scope.deleteLineItem = function(lineitem){ 
      dataService.deleteLineItem([lineitem.lineItemID, payload._id]); 
     } 
     } 
    }, function(reason){ 
     console.log(reason); 
    }); 
} else { 
    if (dataService.retrieveLocal('localCart')){ 
     $scope.lineItems = dataService.retrieveLocal('localCart'); 

     $scope.deleteLineItem = function(lineitem){ 
      var cart = dataService.retrieveLocal('localCart'); 
      var updatedCart = cart.filter(function(item){ 
       if (lineitem.lineItemID != item.lineItemID){ 
        return item 
       } 
      }) 
      dataService.storeToLocal('localCart', updatedCart); 
     } 
    } 
} 

Answer 1

Ich empfehle Ihnen sehr nicht AngularJS Watcher aufgrund der starken Belastung Kosten zu verwenden, im Allgemeinen in Ihrer App versuchen, Ihre Beobachter (Timer) zu minimieren. Darüber hinaus müssen Sie in diesem Fall nicht watcher verwenden, denn wenn Sie LocalStorage verwenden, ist es nicht nötig, die Seite in allen Browser-Registerkarten erneut zu aktualisieren. In der Tat sehen Sie nur $localStorage.lineItems statt $ scope. lineItems und seit $ localStorage.lineItems wurde aktualisiert, alle Browser-Registerkarten werden automatisch aktualisiert. Und in einer Registerkarte haben Sie einen Trigger zum Starten der Anfrage und serverseitige Verarbeitung auf der Grundlage eines Klick-Ereignisses und so weiter, dann als Antwort Ihre localStorage-Variable ($localStorage.lineItems), so wird Ihr Inhalt immer aktualisiert werden.