angular - 如何从管道加载 JSON？

Question

我有一个加载 JSON 文件并在自定义管道中使用该服务的服务:

import { Pipe, PipeTransform } from '@angular/core';
import { Observable } from 'rxjs/Rx';
import { LanguageLoadService } from '../../services/language-load/language-load.service';

@Pipe({name: 'langAsset'})
export class LangAsset implements PipeTransform {

  constructor(private languageService: LanguageLoadService) {

  }

  transform(textKey: string): Observable<any> {
    return new Observable(observer => {
      this.languageService.loadLanguage("en-US").subscribe((langData) => {
        observer.next(langData[textKey] ? langData[textKey] : 'Error');
      })
    });
  }
}

在模板上:

<p>{{'test' | langAsset | async }}</p>

但似乎转换在服务完成加载 JSON 之前运行，因为结果是页面上的 [object Object]，并且 console.log 从内部登录时打印出来很好loadLanguage 订阅。我怎样才能通过在转换函数中返回一个可观察对象而不是一个字符串来让它重新运行？我知道我必须使用 AsyncPipe，但我不确定该怎么做。

Answer 1

尝试使用 <p>{{'test' | langAsset | async | json}}</p>

是嵌套的Json对象，html标签无法理解json管道相当于stringfy Json pipe