javascript - 以 Angular 形式设置键和值

最初，我有一个像这样的简单JSON，

  jsonData = {
    status : "true",
    message: "Dynamic creation of input boxes and patch its value",
    result: [
        {
            "dataOneValue": "12cm"
        },
        {
            "dataTwoValue": "10cm"
        }
    ]
}

还有ngOnInit

ngOnInit() {
  this.jsonData.result.forEach(element => {
    console.log(element);
  });

使用此JSON，我需要创建在结果数组中给出键和值的输入框。

使用上面的我需要设置输入框的键和值，

所以它会喜欢，

关键dataOneValue => value 12cm

关键数据TwoValue => value 10cm

在这里，我仅给出2个只是为了理解，但它不是静态的。.，它可能会根据结果数组具有的对象数而变化。

那么如何从json的result数组中将键和值设置为输入框呢？

Stackblitz https://stackblitz.com/edit/angular-x7mda4

最佳答案

也许这会有所帮助：

https://stackblitz.com/edit/angular-z6fuog

<form [formGroup]="form">
  <span *ngFor="let control of controls">
    <input type="text" [formControlName]="control" placeholder="dataOneValue">
  <br><br>
  </span>
</form>

ngOnInit() {
  // firstName: ['', Validators.required],
  let _controls = {};
  this.jsonData.result.forEach(element => {
    let key = Object.keys(element)[0];
    let control = [element[key], Validators.required];
    _controls[key] = control;
    this.controls.push(key);
    //console.log(_controls);
  });
  this.form = this.formBuilder.group(_controls);
}

关于javascript - 以 Angular 形式设置键和值，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/53613339/