Typescript error: Property 'value' does not exist on type 'Observable<any>'

Typescript error: Property 'value' does not exist on type 'Observable<any>'

这是我的代码,在编译时抛出错误:

export class NoticeService {
  public notice: Observable<any>;
  private observer: any;

  constructor(private translate: TranslateService) {
    this.notice = new Observable(observer => {
      this.observer = observer;
    }).share();
  }

  create(value: string) {
    let translatedValue = this.translate.get(value).value;
    this.observer.next(translatedValue);
  }
}

console.log(this.translate.get(value)) 的输出是:

ScalarObservable {_isScalar: true, value: "Some proper value!", etc.

console.log(translatedValue) 的输出是:

"Some proper value!"

错误是:

ERROR in [default] /somePath/notice.service.ts:21:52
Property 'value' does not exist on type 'Observable<any>'.

第 21 行是:

let translatedValue = this.translate.get(value).value;

有什么问题吗?


更新:

我正在使用 ng2-translate,这是 get 方法:

/**
 * Gets the translated value of a key (or an array of keys)
 * @param key
 * @param interpolateParams
 * @returns {any} the translated key, or an object of translated keys
 */
TranslateService.prototype.get = function (key, interpolateParams) {
    var _this = this;
    if (!key) {
        throw new Error('Parameter "key" required');
    }
    // check if we are loading a new translation to use
    if (this.pending) {
        return this.pending.map(function (res) {
            return _this.getParsedResult(_this.parser.flattenObject(res), key, interpolateParams);
        });
    }
    else {
        var translations = void 0;
        if (this.translations[this.currentLang]) {
            translations = this.parser.flattenObject(this.translations[this.currentLang]);
        }
        return Observable_1.Observable.of(this.getParsedResult(translations, key, interpolateParams));
    }
};

由于返回了一个可观察对象,您需要对其进行订阅。像这样:

create(value: string) {
  this.translate.get(value).subscribe(translatedValue => { 
    this.observer.next(translatedValue);
  });
}

而不是试图直接从中获取价值...

致所有也在寻找更方便方法的用户:与此同时,ng2-translate 的开发人员添加了 'instant()' 方法来直接加载值(必须先加载您的 TranslationLoader工作):参见 https://github.com/ocombe/ng2-translate/issues/20 or, if the, TranslationLoader didn't happen to load before translate.instant(key) was used and only the keys are visible, another Issue dealt with that by waiting for the onLangChange event: https://github.com/ocombe/ng2-translate/issues/85

constructor (private translate : TranslateService){
     translate.onLangChange.subscribe((event: LangChangeEvent) => {
        ...
        let lesson  = new Lesson();

        lesson.title    =  translate.instant("lesson_1_title");

      });
}

不要忘记在 .ts 控制器文件的 header 中从 ng2-translate 加载 LangChange:

import {TranslatePipe,TranslateService, LangChangeEvent} from 'ng2-translate/ng2-translate';