Angular 2/TypeScript：如何访问组件中的可观察属性

我有一个可观察到的，像这样填充的：

this._mySubscription = this._myService.getSomething(id)
                                .subscribe(
                                    response => this._myData = response, 
                                    error => this.displayError(<any>error),
                                    () => this.stopLoading()
                                );

{{_myData?.PropertyNameHere}}

但是如何使用TypeScript访问组件中的相同属性

这将在属性下生成一条弯曲的红线：

this._myData.PropertyNameHere

并说：

属性在Observable上不存在

更新： 服务呼叫示例

getSomething(id: string): Observable<any> {

let params = 'id=' + id;

return this._http
            .post(apiUrl + 'SomeController/SomeAction', params, {withCredentials: true, headers: this.headers})
            .timeoutWith(maxTimeHttpCalls, Observable.defer(() => Observable.throw(this._feedbackService.timeout())))
            .map((response: Response) => response.json().data.Items);

}

getSomething（id:string）：可观察{
设params='id='+id；
返回此。\u http
.post（APIRL+'SomeController/SomeAction'，参数，{withCredentials:true，headers:this.headers}）
.timeoutWith（maxTimeHttpCalls，Observable.defer（（）=>Observable.throw（this.\u feedbackService.timeout（）））
.map（（response:response）=>response.json（）.data.Items）；
}

\u类中的myData

不应为可观察的类型。它应该是您从服务中的

map

操作符返回的对象类型

.map((response: Response) => response.json().data.Items)

无论

data.Items

是什么类型，都应该是

\u myData

的类型。如果您不知道类型是什么，那么只需将其设置为

any

。然后，您可以在没有编译器警告的情况下对其执行任何操作。但是如果您知道数据的结构，最好为它创建一个模型类，这样您就可以得到强类型

interface SomeModel {
  somProperty: string;
}

getSomething(id: string): Observable<SomeModel> {

  return this._http
             ...
             .map((response: Response) => <SomeModel>)response.json().data.Items);
}

接口模型{
属性：字符串；
}
getSomething（id:string）：可观察{
返回此。\u http
...
.map（（response:response）=>）response.json（）.data.Items）；
}

您的组件

class MyComponent {
  private _myData: SomeModel;

  this._mySubscription = this._myService.getSomething(id)
    .subscribe((response: SomeModel) => this._myData = response, 
               error => this.displayError(<any>error),
               () => this.stopLoading());
}

类MyComponent{
private_myData:SomeModel；
this.\u mySubscription=this.\u myService.getSomething（id）
.subscribe（（response:SomeModel）=>this.\u myData=response，
error=>this.displayError（错误），
（）=>this.stopLoading（））；
}

你能展示一下

getSomething

方法吗？当然！我已经更新了这个问题。我想知道它是否没有首先拾取你在超时时抛出的可观测值，因此它将返回类型解释为可观测值。你能在没有

时间的情况下尝试一下吗？

只是让它映射响应？我不确定我是否看到你在哪里键入

这个。_myData

。您可以将其设置为可观察，如

private\u myData:Observable

当它应该是

any

，或者与服务器响应中的Items属性匹配的某个接口类型时。是的，它被声明为这样的

private\u myData:Observable。将其更改为仅
any
后，它就可以工作了。谢谢你，先生！