时间戳

首页 > 解决方案 > 如何在 Angular 项目中声明全局值并在项目的生命周期中使用它

angular - 如何在 Angular 项目中声明全局值并在项目的生命周期中使用它

问题描述

我有一个嵌套对象，它将包含用户 ID、令牌、姓名、电子邮件、电话、公司名称等信息，直到用户注销。调用 API 时，我需要使用对象的某些值。

有没有办法在我的每个组件中全局设置和获取对象的值。目前我所做的是我有 setter 和 getter，我单独设置和获取值，但这非常耗时，因为我单独获取值，所以我必须在每个组件中再次形成 Object。目前的做法：

  1. 创建一个服务类并创建两个函数。

    setEmailData(info) {
this.info = info;
}

getEmailData() {
const temp = this.info;
//  this.clearData();
return temp;
}

我为至少 10 个值执行此操作。有没有办法可以直接创建、设置和获取对象的值？我的实际对象看起来像这样

userData = {
    border: {
      border: '',
      visible: true
    },
    header: {
      title: '',
      visible: true
    },
    isLoggedIn: false,
    uid: '',
    uid_loader: false,
    user: {
      UserID: '',
      company: 'dev',
      emaild: '',
      lastname: '',
      name: '',
      phone: '',
      token: '',
      url: ''
    }
  };

标签： angulartypescriptobject

解决方案

只需创建一个全球服务。

ng g service userService

在您的服务中添加一个私有变量

private userdata: IUserData | undefined

添加公共获取和设置

public get Userdata(): IUserData | undefined {
    return this.userdata
}

public set Userdata(value: IUserData) {
    this.userdata = value
}

然后将服务添加到构造函数中的组件中。

并声明接口

export interface IUserdata {
  border: {
    border: string,
    visible: boolean
  },
  header: {
    title: string,
    visible: boolean
  },
  isLoggedIn: boolean,
  uid: string,
  uid_loader: boolean,
  user: {
    UserID: string,
    company: string,
    emaild: string,
    lastname: string,
    name: string,
    phone: string,
    token: string,
    url: string
  }
}

推荐阅读