Javascript 角度重新加载提供程序值

我用Angular创建了一个web应用程序。事实上，我与我的供应商有问题

{
    provide: MY_PROVIDER_DATA,
    useValue: localStorage.getItem('lang') ? localStorage.getItem('lang') : 'de'
},

如您所见，我正在设置本地存储中的\u PROVIDER\u数据（如果存在）的值。如果不是，它将使用默认值“de”。如果我正在更新localStorage条目的值，我的my_PROVIDER_数据不会检测到任何更改，并且在我重新加载页面之前，它仍然使用第一个值。重新加载页面后，它将采用新值。是否有可能在不重新加载页面的情况下更改该值

---

关于

使用如此简单的提供者无法做到这一点。当提供程序的值更新时，它不会引发事件供您捕获。但是，如果您仍然坚持使用这样的提供者，则必须使用

rxjs

func每隔

x

毫秒对其值进行一次采样。因为这不是我建议你做的，所以我不加一个例子

我为您提供的解决方案是将您的提供商更改为能够处理最新

lang

值的服务。将它注入组件，您将得到对

lang

变量的更改

下面是一个示例代码：

共享的.service.ts：

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

import { Subject } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class SharedService {
  langChanged = new Subject<string>();
  lang = localStorage.getItem('lang') || 'de';

  constructor() {
    this.langChanged.subscribe(lang => {
      this.lang = lang;
      localStorage.setItem('lang', lang);
    });
  }
}

export class SomeComponent implements OnInit, OnDestroy  {
  sub: Subscription;
  lang: string;

  constructor(private sharedService: SharedService) {
    this.lang = sharedService.lang;
  }

  ngOnInit() {
    this.sub = this.sharedService.langChanged.subscribe(lang => {
      this.lang = lang;
    });
  }

  ngOnDestroy() {
    this.sub.unsubscribe();
  }

  onChangeLang(): void {
    this.sharedService.langChanged.next('en');
  }
}

---

您需要使用

useFactory

。谢谢您的回复。但是我的组件已经获得了最新的语言值。我的问题是，我已经安装了ng recaptcha（谷歌recaptcha）。要更改重新验证码的语言，我需要通过提供程序设置语言。但提供程序仅在页面刷新时获取该值。