Как получить результат регистрации (от login.ts) до login.html

Question

Я новичок в Aurelia и имею некоторый фон в Javascript. В частности, я черпаю вдохновение от https://blog.rackspace.com/part-2-building-serverless-architecture-aws и https://github.com/auth0/aurelia-quote-app, чтобы построить слияние двух.

Я могу успешно позвонить в AWS Cognito и получить разные результаты проверки. Я знаю, что они успешны, открыв консоль разработчика в firefox для мониторинга console.logs для разных сценариев.

Например я получаю разные ответы в console.log:

1. пользователей, которые существуют в Coginto, но неправильный пароль: «NotAuthorizedException: Неправильное имя пользователя или пароль.»
2. Пользователи, которых нет в Cognito: «UserNotFoundException: Пользователь не существует».
3. Пользователи с правильным паролем: получить JWT токенов

В моей login.html я намерен вывести сообщение об ошибке входа через $ {loginError} переменная

-- login.html 

    <form role="form" submit.delegate="loginUser()"> 
     ... 
     <button type="submit" class="btn btn-default">Login</button> 
    </form> 
    ... 
    <div class="alert alert-danger" >${loginError}</div> 
    ... 

, так что я могу показать исключения, которые происходят в login.ts через html путем привязки

В моем login.ts я вызываю cognitoUser.authenticateUser следующим образом.

--login.ts 
export class Login { 
    ... 
    isUserAuthenticated = false; 
    ... 
    loginError = ''; 
    ... 
    loginUser() { 
     cognitoUser.authenticateUser(authenticationDetails, { 
      onSuccess: function (result) { 
      console.log(result); 
      this.isUserAuthenticated = true; 
      location.assign('#/home'); 
      }, 
      ... 
      onFailure: function(err) { 
      console.log(err); 
      this.loginError = err; 
      this.isUserAuthenticated = false; 
      } 
      ... 

Когда this.loginError устанавливается в заблуждение, это не отражается в HTML. Вероятно, это связано с характером функций обратного вызова в Javascript ... Я пытаюсь понять, как это решить; что html должен отображать loginError, и фактическая ошибка возникает из функции обратного вызова в authenticateUser. Я уверен, что this.isUserAuthenticated столкнутся с той же проблемой.

С положительной стороны, когда логин успешно завершен, location.assign ('#/home'); это получить выполняется (даже если this.isUserAuthenticated = правда, не получает отражение в основном login.ts)

Заранее спасибо за помощь

Answer 1

Отвечая на мой собственный вопрос, благодаря помощи Callback function in aurelia js

По существу, используйте функции ES6 и стрелки для доступа к «этому».

cognitoUser.authenticateUser(authenticationDetails, { 
    onSuccess: (result) => { 
    console.log(result); 
    this.isUserAuthenticated = true; 
    location.assign('#/home'); 
    }, 
... 
    onFailure: (err) => { 
    console.log(err); 
    this.loginError = err; 
    this.isUserAuthenticated = false; 
    } 
});