Лучшая практика написания контроллера AngularJS в машинописном тексте

Question

Я действительно новичок в AngularJS и веб-разработке и более опытных на C# и C++. Из-за этого я пытаюсь использовать TypScript.

Я сейчас работаю над контроллером и получил какое-то странное поведение. При использовании функции входа в систему, как в приведенном ниже коде, возникает проблема, что службы sessionService и userDataService не определены внутри then-statement. Доступен до и после этого.

class UserController { 
    scope: UserControllerScope; 
    location: ng.ILocationService; 
    sessionService: SessionService; 
    userDataService: UserDataService; 

    constructor($scope: UserControllerScope, 
       $location: ng.ILocationService, 
       userDataService: UserDataService, 
       sessionService: SessionService){ 
    this.scope = $scope; 
    this.location = $location; 
    this.userDataService = userDataService; 
    this.sessionService = sessionService; 
    } 

    loginUser(username: string, pw: string) { 
    var foundUser; 
    console.log(this.sessionService); 
    console.log(this.userDataService); 
    console.log("Got into LoginUser"); 

    this.userDataService.getUserAsync(username, pw).then(function(foundUserFromDb) { 
     console.log(this.sessionService); 
     console.log(this.userDataService); 
    }); 

    console.log(this.sessionService); 
    console.log(this.userDataService); 
    this.location.path("views/projects.html") 
    } 
} 

Есть ли способ таможенные услуги необходимо вводить так, чтобы они могли быть доступ везде в классе или у вас есть более эффективные способы борьбы с инъекцией услуг и контроллеров?

Заранее спасибо.

Answer 1

this в контексте then() не является контроллером. Вы должны записать this в другую переменную, такую ​​как self. Машинопись сделает это для вас, если вы используете функции стрелок ...

loginUser = (username: string, pw: string) => { 
    var foundUser; 
    console.log(this.sessionService); 
    console.log(this.userDataService); 
    console.log("Got into LoginUser"); 

    this.userDataService.getUserAsync(username, pw).then(foundUserFromDb => { 
     console.log(this.sessionService); 
     console.log(this.userDataService); 
    }); 

    console.log(this.sessionService); 
    console.log(this.userDataService); 
    this.location.path("views/projects.html") 
} 

скомпилированного JavaScript должен выглядеть примерно так ...

var _this = this; 
this.loginUser = function (username, pw) { 
    var foundUser; 
    console.log(_this.sessionService); 
    console.log(_this.userDataService); 
    console.log("Got into LoginUser"); 

    _this.userDataService.getUserAsync(username, pw).then(function (foundUserFromDb) { 
     console.log(_this.sessionService); 
     console.log(_this.userDataService); 
    }); 

    console.log(_this.sessionService); 
    console.log(_this.userDataService); 
    _this.location.path("views/projects.html"); 
};