Angular 5 应用程序的任何组件访问数据。正在通过身份验证服务中的 API 调用设置数据

Posted 2023-03-13

【中文标题】Angular 5 应用程序的任何组件访问数据。正在通过身份验证服务中的 API 调用设置数据

【英文标题】：Data accessing by any components of angular 5 application. Data is being set via a API call inside auth service

【发布时间】：2019-01-21 23:33:47

【问题描述】：

我有一个共享的身份验证服务，它由我的 Angular 5 应用程序中的所有组件注入。我的身份验证服务中的变量很少。我在身份验证服务中调用 api 并将响应值设置为变量。现在我想从我的应用程序中随时从任何组件访问这些变量的值。我不想使用本地存储或会话存储。

【参考方案1】：

我发现在处理 HTTP 调用时，使用 Promise 更容易推理事物 - 所以我将给你一个使用 Promise 的解决方案。

class UserService 
    private userData;
    private userDataPromise;

    getUserData(...)
        if(this.userData)
            return Promise.resolve(this.userData); //if we have the data, just return it
        

        if(this.userDataPromise)
            // in case the call to the api is in progress, we don't want to make a new one.
            return this.userDataPromise;
        

        this.userDataPromise = this.http.get(...).toPromise()
                                   .then((data) => this.userData = data)
                                   .finally(() => this.userDataPromise = undefined);
        return this.userDataPromise;
    

例如，一旦用户注销，您就可以重置数据。

HTH