dynamic change of variable to ngmodel is not working

Question

I am trying to make date change dynamically and get date reflected in view but it is not getting reflected.When date is hard-coded like this in an array it is getting reflected in view. My date : Array<String> = ['2020-02-25']; is getting reflected in view.But my date which is changed after a post subscription is not getting reflected.Here is the code for that.

ngOnInit() {
    this.sendPostRequest();
  }


sendPostRequest()  {

      var options = { headers: new HttpHeaders({ 'Content-Type': 'text/plain' }) };

      this.http.post("http://localhost/android/Api.php?apicall=getattendance", this.postData,options)

      .subscribe(data => {

        let key, count = 0;
for(key in data) {

 this.date.push(data[count]['date']);

 count++;
}

The view for that is

  <ion-calendar [(ngModel)]="date"
                  (change)="onChange($event)"
                  [options]="options"
                  type="string"
                  format="YYYY-MM-DD"
                  readonly="true"

                  >
    </ion-calendar>

ng-model accepts change from date which is given as hard coded.But this.date is not getting reflected.

 <div *ngFor="let item of date">
    <p>{{ item}}</p>

</div>

is also outputing only the dates that is hardcoded as 2020-02-05

Answer 1

There are few limitations to ngModel. Since you have (change) function, you can assign the changed value to this.date

 onChange(event){
     this.date = event.target.value
 }