如何从 Singleton 获取变量？答案

【问题标题】：How can I get variables from Singleton?如何从 Singleton 获取变量？
【发布时间】：2022-02-24 03:19:42
【问题描述】：

我正在尝试制作一个单例以从不同的组件中获取两个变量，这些变量由始终在其他组件之前执行的组件定义。

我遇到的问题是 Singleton 实例没有保存，当从另一个组件访问它时，它会创建一个新实例，从而丢失它保存的变量。

下面我附上单例类的代码，我如何设置变量以及如何尝试从其他组件获取它们：

Singleton.ts

export class Singleton {
  private static instance: Singleton = new Singleton();
  private var1: string = '';
  private var2: string = '';

  private constructor() {}

  public static getInstance() {
    if (!this.instance) {
      this.instance = new Singleton();
    }
    return this.instance;
  }

  public getVar1():string {
    return this.var1;
  }

  public getVar2():string {
    return this.var2;
  }

  public setVar(var1:string, var2:string):void {
    this.var1= var1;
    this.var2 = var2;
  }
}

home.component.ts

ngOnInit() {
    var var1 = "example1"
    var var2 = "example2"
    let global = Singleton.getInstance();
    global.setVar(var1, var2);
    console.log(global);
  }

call.component.ts

ngOnInit() {
    let global = Singleton.getInstance();
    this.var1 = global.getVar1();
    this.var2 = global.getVar1();
    console.log(global);
  }

home.component.ts 中的 console.log() 打印 var1=example1 和 var2=example2，而不是 call.component.ts 打印 var1='' 和 var2=''。

【问题讨论】：

您在这里使用了错误的单例模式。使用根目录中提供的服务，这些是单例服务（整个应用程序中只有一个实例）。如果您想以反应角度的方式使用它们，请使用主题观察者模式查看此答案：stackoverflow.com/questions/57355066/…
不确定你是如何使用它的，但是 Angular 有一个非常好的 DI 系统可以为你解决这个问题。这里的问题可能是你在一个组件中创建这个东西，然后移动到下一个组件。问题是，第一个组件和你的类一起被破坏了。如果您真的想这样做（我不会这样做），请确保在 app.component 中调用该类，因为该组件永远不会被破坏。

标签： angular typescript singleton

【解决方案1】：

如果您想在另一个组件中使用相同的值，那么您需要使用输入和输出装饰器。看看下面的链接

https://angular.io/guide/inputs-outputs

【讨论】：