ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value:......... in ngFor loop changed my data called from APİ. settimeout , changedetectref did not help ... below is the code, I will be glad for any help. Thanks!
Companent.ts:
export class EditBrokerComponent implements OnInit, AfterViewInit, AfterViewChecked,{
constructor( private fb : FormBuilder, private apiservice: ApiService,
private route:ActivatedRoute, private router:Router, private cdRef:ChangeDetectorRef) {
this.createRekForm();
this.id = this.route.snapshot.params.id;
}
getBrokerRekvizits(id:number)
{
setTimeout(() => {
this.apiservice.getBrokerRekvizits(id).subscribe(res=>{
this.data = Array.from(Object.values(res));
})
}, 1000);
ngOnInit(): void
{
this.getBrokerRekvizits(this.id);
}
ngAfterViewChecked()
{
this.cdRef.detectChanges();
}
}
apiservice.ts
getBrokerRekvizits(id:number)
{
return this.http.get<any>('http://api/rekvisit/show/'+id)
}
Html:
<mat-expansion-panel hideToggle *ngFor="let item of data ; let counter=index">
<mat-expansion-panel-header>
<mat-panel-title>
Rekvizit {{ counter +1}}
</mat-panel-title>
</mat-expansion-panel-header>
<form style="width: 100%;" [formGroup]="editrekvisitform" (ngSubmit)="editRekvisit(item.id,editrekvisitform.value)">
<label for="name"> Text </label>
<input id="name" type="text" formControlName="name" [(ngModel)]="item.name">
<button type="submit" mat-raised-button [disabled]="editrekvisitform.invalid"
color="warn">Yenilə</button>
</form>
