我为另一个变量设置数据后无法为下一个变量设置数据

时间:2019-04-25 07:10:26

标签: angular typescript firebase

我想从Firebase提取数据并将其显示在表单上,​​以便用户可以更新他们之前输入的信息,但是我只能显示“ schoolName”的数据,而从Firebase提取的整个数据都消失了。我做了console.log(data)来检查它,但是它什么也没显示。我需要更改代码的哪一部分才能显示“ schoolName”和“ studentName”的数据?

<html>
 <tbody>
  <tr id='schoolName' *ngFor="let field of Form.value.schoolName; 
  let i = index">
  <td class="text-center">
  {{i}}
  </td>
  <td>
  <input type="text" name='schoolName' placeholder='Name' class="form- 
  control"
  [(ngModel)]="field.schoolName" [ngModelOptions]="{standalone: true}" />
  </td>
  <td class="text-center">
  <button type="button" class="btn btn-sm btn-danger"                                          
  (click)="delete_school_row(field.id)">Delete</button>
   </td>
  </tr>
  <tr id='studentName' *ngFor="let field of Form.value.studentName; 
  let i = index">
  <td class="text-center">
  {{i}}
  </td>
  <td>
  <input type="text" name='studentName' placeholder='Name' class="form- 
  control"
  [(ngModel)]="field.studentName" [ngModelOptions]="{standalone: true}" />
  </td>
  <td class="text-center">
  <button type="button" class="btn btn-sm btn-danger"                                          
  (click)="delete_student_row(field.id)">Delete</button>
   </td>
  </tr>
 </tbody>
</html>

<ts>
if (this.mode == "edit") {
  this.schoolService.GetDataById(this.id).subscribe(data => 
{
this.Form.value.schoolName = [];
    if (data.schoolName) {
      for (var b = 0; b < data.schoolName.length; b++) {
        this.Form.value.schoolName= data.schoolName[b]
      }
    }
    this.Form.controls["schoolName"].setValue(data.schoolName)
console.log(data.studentName)
this.Form.value.studentName = [];
    if (data.studentName) {
      for (var b = 0; b < data.studentName.length; b++) {
        this.Form.value.studentName= data.studentName[b]
      }
    }
    this.Form.controls["studentName"].setValue(data.studentName)
});
}
</ts>

1 个答案:

答案 0 :(得分:0)

您必须将项目推送到数组中 使用

this.Form.value.schoolName.push(data.schoolName[b]) 而不是使用this.Form.value.schoolName= data.schoolName[b]

,我不知道您为什么将项目推入this.Form.value.schoolName, 您可以将项目推送到ts文件中的全局初始值,因为您没有在HTML中使用表单,仍然可以通过[(ngModel)]

将其绑定到任何控件

我还相信在这种情况下使用forEach而不是for循环会更方便。

*回顾:

let schoolNames = [], studentNames = [];
if (this.mode == "edit") {
  this.schoolService.GetDataById(this.id).subscribe(data => 
{
this.Form.value.schoolName = [];
    if (data.schoolName)            
           forEach(data.studentName, (key, value) => {
           schoolNames.push(value);
        });
    //this.Form.controls["schoolName"].setValue(data.schoolName)
console.log(data.studentName)
this.Form.value.studentName = [];
    if (data.studentName)
           forEach(data.studentName, (key, value) => {
           schoolNames.push(value);
        });
    //this.Form.controls["studentName"].setValue(data.studentName)
});
}

并设置HTML循环*ngFor="let field of schoolNames

我不知道这是否有帮助,但是如果没有帮助,请尝试澄清您的问题,因为这是我所能提供的最好信息。