表单的设置值

Question

我使用 angular CLI1.6、angularfire2 和 firebase。我使用一个可观察对象，我想用 firebase.

的值填充我的表单

我的 firebase 界面：

export class PPS
{
constructor (public Patientid : string, public traitement: string,
public datedebut = new Date, public datefin : string, 
public description: string, public effetsind, public Esresp: string, public 
medresp: string, public contactmail: string,
public contacttel: string) {}
}

我试试这个：

this.ppssToDisplay = this.ppssService.getSinglePPS(this.key)
.subscribe(res=>{
  this.ppsForm.controls['traitement'].setValue(this.ppssToDisplay.traitement);
  console.log(this.ppssToDisplay.traitement);
});

怎么了？ console.log(this.ppssToDisplay.traitement) 发给我 "undefined"

Answer 1

this.ppssToDisplay 是你的观察对象试试这个，

this.ppssToDisplay = this.ppssService.getSinglePPS(this.key)
.subscribe(res=>{
  let response = res;
  this.ppsForm.controls['traitement'].setValue(response.traitement);
  console.log(response.traitement);
});

要使值在您的 html 元素中可用，您必须在输入元素上使用 (ngModel)]。为此，创建一个全局 class 变量，例如 ppssServiceData 并在您的回调中加载此变量，如

this.ppssToDisplay = this.ppssService.getSinglePPS(this.key)
 .subscribe(res=>{
   this.ppssServiceData = res;
   this.ppsForm.controls['traitement'].setValue(this.ppssServiceData.traitement);
   console.log(this.ppssServiceData.traitement);
});

现在，使用此变量绑定您的日期字段，即 this.ppssServiceData 喜欢

<input type="text" .... [(ngModel)]="ppssServiceData?.YOUR_DATE_KEY" />

Answer 2

将您的属性移到订阅中并为其分配值..

 this.ppssService.getSinglePPS(this.key)
.subscribe(res=>{
    this.ppssToDisplay = res;
    this.ppsForm.controls['traitement'].setValue(this.ppssToDisplay.traitement);
    console.log(this.ppssToDisplay.traitement);
});

表单的设置值

SetValue of Form

asynchronous

angularfire2

angular

angular-reactive-forms