Anulgar - 在启动应用程序或刷新时查看 HTML 内容之前需要请求的结果

如何解决Anulgar - 在启动应用程序或刷新时查看 HTML 内容之前需要请求的结果

我遇到了一个问题，我想以最佳方式解决。我有一个来自后端的请求，它向我发送了一个对象 {key,value} 列表，它是一个枚举，以及这个枚举的描述。我需要使用此描述来“翻译”某些组件中代码中的枚举。我使用的是像 {{ enum | translateEnum }} 这样的管道，它返回要显示给用户的描述。我所做的是一个 Map，它将枚举存储为键，将描述存储为值。到目前为止，我猜还不错。

我的问题：当我启动应用程序或进行刷新并且管道触发时，地图为空，因为已发出请求但尚未得到结果。 （我在登录后触发请求）。处理这个问题的最佳方法是什么？我正在切换到服务中的可观察地图，但需要在每个组件中订阅此地图，并且需要执行这样的操作

{{ enumsMap.has(enum) ? enumsMap.get(enum) : enum}}

好像不太好。任何建议以其他方式执行此操作？

所有这一切都是因为我只有在收到请求的结果后才会首先看到页面。之后一切正常，因为地图有内容。

管道：（我正在切换的旧版本）

  transform(value: string): string {
    let valueTranslated = value;

    if (this.translateStatusService.enumsMap.has(value)) {
      valueTranslated = this.translateStatusService.enumsMap.get(value);
    }

    return valueTranslated;
  }

获取请求的服务（Already with observable）：

export class TranslateStatusService {
  
  private enumTranslateBehavior = new BehaviorSubject<Map<string,string>>(undefined);
  enums$ = this.enumTranslateBehavior.asObservable();

  enumsMap: Map<string,string>;

  domainURL = `${environment.API_BASE_URL}`;

  constructor(private http: HttpClient) {
    this.enumsMap = new Map<string,string>(undefined);
    this.saveStatusTranslations();
  }

  getStatusTranslations() {
    return this.http.get(`${this.domainURL}/enums/list`);
  }

  saveStatusTranslations() {
    this.getStatusTranslations().subscribe(mainEnum => {
      mainEnum['enums'].forEach(enumObject => {
        this.enumsMap.set(enumObject['name'],enumObject['description']);
      });
      this.enumTranslateBehavior.next(this.enumsMap);
    });
  }

}