angular - Angular2: Åtkomst till klassvariabel inom anonym funktion

Jag är säker på att det finns ett enkelt sätt att göra detta, men jag kan inte hitta det. Här är min kod

export class UserLoginComponent {
private user: User;
public authService: AuthService;

constructor(private cognitoConfigs: CognitoUtil, authService: AuthService) {
    this.user = new User();
    this.authService = authService;
}

authenticate() {

    // Some work being done here
    let cognitoUser = new AWSCognito.CognitoIdentityServiceProvider.CognitoUser(userData);

    cognitoUser.authenticateUser(authenticationDetails, {

        onSuccess: function(result: any) {
            this.authService.login(this.user, result);
        },
        onFailure: function(err: any) {
            console.log(err.message);
        },

    });

}
}

Problem: I onSuccess-återanropet kan jag inte komma åt this.authService-variabeln som tillhör dess föräldraklass.

Svar #1

Använd inte function() eftersom det ändrar omfattningen av this.

Pilsfunktions behåller räckvidden för this

    onSuccess: (result: any) => {
        this.authService.login(this.user, result);
    },
    onFailure: (err: any) => {
        console.log(err.message);
    },

Svar #2

Problemet här är att framgångs-tilbaka-anropsfunktionen är i en annan lexikalisk miljö. Detta är varför i ES6+ kan funktioner definieras med pilfunktioner =>.

onSuccess:(result: any) => {
        this.authService.login(this.user, result);
}

eller tilldela detta till en variabel utanför funktionens omfång med ES5-syntaxen:

var self = this;

onSuccess: function(result: any) {
    self.authService.login(this.user, result);
}

Relaterade artiklar