I am currently developing application on Angular 2(4) with KendoUI components for Angular.
Now I am trying to implement simple form with DropdownList. Data for that dropdown is loading from remote api. The problem is that when dropdown is opened i receive a very confusing error:
ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'undefined'. Current value: '590px'.
I am not expirienced in Angular so any help will be appreciated.
Markup :
<kendo-dropdownlist formControlName="parentCompanyId" class="form-control" [valuePrimitive]="true" [data]="parentCompanys"
textField="name" valueField="id" ></kendo-dropdownlist>
component(simplified):
export class EmployerComponent implements AfterViewInit {
public Employer: Employer = new Employer();
public employerForm: FormGroup;
public parentCompanys: Array<any> = [];
constructor(private employersService: EmployersService) {
}
ngOnInit() {
this.employerForm = new FormGroup({
parentCompanyId: new FormControl(this.Employer.ParentCompanyId, [
Validators.required
])
});
}
ngAfterViewInit() {
this.employersService.getCompanies().subscribe(response => {
this.parentCompanys = response.data;
});
}
}
UPD: 04.07.2017
I spent some time trying to solve this issue with different solutions from question mentioned in comment (link) without any success.
But today i have updated my kendo-ui packages and it seems that error is gone. I am not sure but looks like it was a bug in kendo-ui component.
the links which i belive related to this issue