*ngIf导致浏览器崩溃

Question

在我的一个模板中，我有一个如下条件：

<span *ngIf="(authService.isAuthenticated() | async)"> .. </span>

isAuthenticated()函数的定义如下：

 isAuthenticated() {
    return new Promise((resolve, reject) => {

      if (firebase.auth().currentUser) {
        resolve(true);
        this.updateToken();
      } else {
        resolve(false);
      }

    });
  }

为什么这会导致浏览器崩溃？

Answer 1

您不能直接从组件执行服务方法。

在component.ts中定义一个布尔变量，并根据服务值设置它。

 isAuthenticated = false;

并通过调用您的服务来更改变量。将您的HTML更新为

<span *ngIf="isAuthenticated"> .. </span>

这就是如何将authService注入到组件中，

constructor(public authService: yourAuthService) { }