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

Question

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

<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]"

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

ngModel is not working when using in dynamic data scenario?

checkbox

dynamic

checkboxlist

ngmodel

angular