在动态数据场景中使用时，ngModel 不起作用？

Question

实际上，我正在尝试使用 Angular 4 cli 和 JSON 数组来创建自定义数据表。我已经成功创建了带有动态列和动态行的表。所以，我想通过使用下拉复选框样式来修复表格的过滤列。这是我的代码：

<div class="col-md-12">
    <div class="input-group">
      <div class="input-group-btn" dropdown>
        <button type="button" class="btn btn-primary dropdown-toggle" dropdownToggle>Filter
          <span class="caret"></span>
        </button>
        <div class="dropdown-menu" *dropdownMenu>
          <div class="checkbox" *ngFor="let column of columns, let i = index" >
              <label for="column">
                <input [(ngModel)]="column" type="checkbox" id="column" name="column" value="column" checked="true"> {{column}}
              </label>
            </div>
        </div>
      </div>
    </div>

而我的component.ts文件代码是：

StudentsDetails = [];

  columns: string[] = [];

  constructor(private newService: StudentsService) { }

  ngOnInit() {
    this.newService.fetchData()
    .subscribe(responseStudentsDetails => {
      this.StudentsDetails = responseStudentsDetails;
      this.columns = Object.keys(this.StudentsDetails[0]);
    })
  };

所以，当我尝试调用 [(ngModel)]="column" 时。它向我显示错误，例如：Uncaught (in promise): Error: Cannot assign to a reference or variable!

Answer 1

使用*ngFor 定义的变量有一些限制。

您可以使用以下方法解决：

[(ngModel)]="columns[i]"