动态改变提供者的价值答案

【问题标题】：Dynamically Change provider's value动态改变提供者的价值
【发布时间】：2021-10-27 17:53:19
【问题描述】：

import { NgModule} from '@angular/core';
export const my_custom_format{
var date_format=localStorage.getItem('date_format')
}
...

@NgModule({
  imports [
  ...
  ],
  declarations [
  ...
  ],
  entryComponents [
  ...
  ],
  providers [
  {provide: LOCALE_ID, useValue:date_format}
  ]
})

当我进入页面时，我的 date_format 从 localStorage 获取值。但是，如果我在 locaLstorage 中的项目发生变化，则 date_format 不会更新。该怎么做？

【问题讨论】：

{提供：OWL_DATE_TIME_FORMATS，useValue:date_format}

标签： angular

【解决方案1】：

依赖注入 (DI) 以 Angular 工作的方式，至少目前，唯一的方法是将值保存在 localStorage 中并刷新应用程序/页面，然后在 useFactory、useValue 中选择该值或 useClass 在应用加载时。

在组件的生命周期中，提供者只发生一次运行时执行。据我所知，如果我们想更改提供程序，我们必须再次卸载并重新安装组件。

【讨论】：

您能解释一下如何卸载和重新安装组件吗？
检查这个 SO 答案，希望对您有所帮助。 stackoverflow.com/a/52354498/4109794 如果没有，请尝试刷新 Angular 应用程序并使用 useValue 从 localStorage 等中选择值

【解决方案2】：

重要 - 这是一个 hack，我不知道它是否能实现你想要做的事情。我的猜测是您正在尝试将语言环境 id 注入您的某些组件并在那里使用它们。

如果您尝试以这种方式更改语言，那么很遗憾地告诉您，通过更改本地存储中的区域设置 ID 不起作用。

您可以尝试以下方法（看看是否有效）

export class LocalStorage {
    public static get DateFormat() {
        return localStorage.getItem('date_format');
    }
}

对于提供者部分：

{provide: OWL_DATE_TIME_FORMATS, useValue:LocaleStorage.DateFormat}

【讨论】：

尊敬的先生，但是每当我更改 localStorage 中的值时，应用程序都会从 localStorage 中获取旧值而不是更新值，这是主要问题
我真的不明白这个问题。你能更彻底地解释一下吗？你怎么知道应用程序没有获得新的值。什么症状？

【解决方案3】：

在 Angular 中，提供者是一个单例类，这意味着它们被初始化一次，并且将请求它的每个地方（组件等）都将获得与初始化相同的实例。

了解这一点后，我们才能了解您的情况。 LOCAL_ID 的值使用date_format 值初始化一次，从这里开始，LOCAL_ID 的值将不会随着date_format 的更改而更新。

您可以做的一件事是在您想要的每个组件中都有这个提供程序，这将获得date_format 的最新值。

【讨论】：