jeudi 14 septembre 2017

ngModel is not working when using in dynamic data senario?

Actually I am trying to create a custom datatable by using the Angular 4 cli and the JSON arrays. I have successfully created the table with dynamic column and the dynamic rows. so, that I want to fix a filter column for the table by using the dropdown checkbox style. Here is my code:

`<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"> 
                      </label>
                    </div>
                </div>
              </div>
            </div>`

And my component.ts file code is:

StudentsDetails = [];

  columns: string[] = [];

  constructor(private newService: StudentsService) { }

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

So, when I am trying to call the [(ngModel)]="column". It shows me the Error like:Uncaught (in promise): Error: Cannot assign to a reference or variable!




Aucun commentaire:

Enregistrer un commentaire