kann nicht aktualisiert Controller binden als variable AngularJS

Question

Ansicht zu sehen in:

<div ng-controller="MainPageController as mpc"> 
    <h1>{{mpc.city}}</h1> 
</div> 

Controller:

app.controller('MainPageController',['GetCityService', function(GetCityService){ 
    this.city = null; 
    this.getCityService = GetCityService; 
    this.getCityService.getCity().success(function(data){ 
     this.city = data.city 
     console.log(this.city); // Prints the city correctly. 
    }); 
}]); 

Ich versuche, "Controller als" Methode zu verwenden, um Werte von der Steuerung zuzugreifen. Mein Dienst gibt den Städtenamen korrekt zurück, der der Controller-Variablen "this.city" zugewiesen ist. aber ich bin nicht in der Lage, den Wert in der Ansicht zu binden "

Bitte lassen Sie mich wissen, wenn ich es falsch mache. PS: Ich habe versucht, $ Scope zu verwenden, es funktioniert perfekt Ich kann nicht verstehen, warum ich die Controller-Variable nicht binden kann "und wenn möglich vorschlagen, wenn $ scope und diese Variablen verwendet werden sollen.

Vielen Dank im Voraus :)

Answer 1

Da die ursprünglichen Frage beantwortet worden ist, werde ich versuchen, die Antwort zu erklären. Es ist nur eine Frage des Verständnisses "dieses" in Javascript.

Innerhalb Ihrer Controller-Funktion bezieht sich "dies" auf den Controller selbst. Bei Ihrem Erfolg Callback 'dies' nicht mehr auf den Controller (Ich rate das Fenster, wenn Sie nicht im strikten Modus sind?).

Wenn Sie 'this' in eine Variable wie 'vm' speichern, wissen Sie beim Verweis auf vm, dass Sie auf den Controller verweisen und nicht auf das, was 'in diesem Kontext' bedeutet (was sich ändern kann).

Da wir alle diese Funktionen in 1.5 haben, ist es am besten, $ scope nicht mehr zu verwenden und immer 'controllerAs' zu verwenden. Ich empfehle auch, zu Komponenten zu wechseln, anstatt eigenständige Controller zu verwenden.