使用异步管道到模板上的属性

时间:2017-11-15 18:57:22

标签: javascript angular

$params = (object)array(
    "locale" => 'en_US',
    "client_country_code" => 'US',
    "fb_api_req_friendly_name" => 'save_core_profile_info',
    "access_token" => $token_user);

$params->work = json_encode(array(array(
    "id" => 12345678,
    "privacy" => '{"value":"EVERYONE"}',
    "ref" => "nux_android"
    )));

通过Web服务成功检索数据。 MyData对象具有属性firstName,我想使用异步管道在模板内表示。

我试过

export class MyClass {
    data: MyData;  
    constructor(private dataService: DataService) {    
      this.dataService.getData().subscribe((myData) => {
        this.data = myData;
      });  
    }
}

这种方法根本没有将属性绑定到模板,<input required [ngModel]="data.firstName | async" (ngModelChange)="onChange($event)" name="firstName"> 有效,但我被告知这种方法不能与异步管道一起使用。

更新

[(ngModel)]="data.firstName"

1 个答案:

答案 0 :(得分:2)

使用

export class MyClass {
    data: Promise;  
    constructor(private dataService: DataService) {    
      this.data = this.dataService.getData()
    }
}

| async管道已经是订阅

<input required [ngModel]="(data | async)?.firstName" (ngModelChange)="onChange($event)" name="firstName">

或使用您的代码

<input required [ngModel]="data?.firstName" (ngModelChange)="onChange($event)" name="firstName">

我刚刚添加?以避免在数据尚未可用时出错。