Question

我有一个共享服务，我用它来存储全局变量，如身份验证令牌。我遇到问题，确保值得到更新，并且我的组件中使用了最新值。例如：

import {Injectable} from '@angular/core';

@Injectable()
export class GlobalVariablesProvider {

  private auth_token: string;

  constructor() {}

  getAuthToken() {
    return this.auth_token
  }

  setAuthToken(auth_token) {
    this.auth_token = auth_token
  }
}

然后在我的login-component我设置了auth_token：

this.clientService.login(user).subscribe(
  successData => {
    this.current_user = successData["user"]
    this.globalService.setAuthToken(this.current_user.auth_token)
  }
}

但是当我导航到其他页面/使用新组件时，auth_token偶尔会失去同步（我相信如果服务正在重新初始化并丢失auth_token值）。

this.auth_token = this.globalVarService.getAuthToken()
// occasionally returns null

有没有办法确保设置nce这个变量，在注入另一个组件后该值是否仍然存在？

Answer 1

在根模块中声明服务使其成为Singleton，因为angular具有分层注入器。

Answer 2

首先，在应用的根模块中导入服务，并将其插入NgModule声明中的providers部分。从现在开始，它将像单例一样运行，并且可用于应用中的所有组件，而不会将其传递到每个组件的providers。

如果您希望始终将auth_token与您注入此服务的每个组件保持同步，则可以使用rxjs包中的主题，该主题包含在Angular安装中。关于它的帖子on Medium很好。例如：

import {Injectable} from '@angular/core';
import { Subject } from 'rxjs/Subject'

@Injectable()
export class GlobalVariablesProvider {

  private auth_token: Subject<string> = new Subject<string>()

  constructor() {}

  getAuthToken() {
    return this.auth_token
  }

  setAuthToken(auth_token) {
    this.auth_token.next(auth_token)
  }
}

然后，将其注入您需要的组件中。然后，如果您需要获取当前令牌，而不是使用从getAuthToken()收到的值，您可以订阅它。因此，您的组件将始终与当前令牌同步：

this.globalVarService
  .getAuthToken()
  .subscribe(token => {
    this.auth_token = token
  })

什么时候Angular 2服务初始化

2 个答案: