Angular (8) why not obnovlyaetsya template?

I have a component, it is a property of sensors: Array
In the template there is a line
<div class="pr-sensors-item" *ngFor="let item of sensors">


the problem is that when I try to install new elements of the array that the template is not updated
and this happens only if I change the array from callback function after Http Request
ie:
getSensors() {
this.sensors = [{}, {}] // so the works and the template is being rendered
this.sensorsService
.get(this.machineParentId)
 .subscribe((response) => {
 this.sensors = response.sensors // doesn't work
 // or
this.sensors.push(...response.sensors)
});
}
March 25th 20 at 13:47
2 answers
March 25th 20 at 13:49
Solution
Do you happen to in the component should not changeDetection: ChangeDetectionStrategy.OnPush?
Angular detected changes in inutah by reference in OnPush. When you create a new list with
this.sensors = [{}, {}], but that reference a new list, and when you change how the video source values through this.sensors.push the object reference does not change.

So either use the spread operator
this.sensors = [...this.sesnsors, ...response.sensors]

Or manually tell Angular to check change how the video source using this.changeDetector.markForCheck()
(changeDetector from the designer, private changeDetector: ChangeDetectorRef)
So works, thanks a lot. has solved a lot of problems - Alba_Gottlieb3 commented on March 25th 20 at 13:52
March 25th 20 at 13:51
*ngFor="let item of sensors$ | async;"
sensors$ = this.sensorsService.get(this.machineParentId);

Find more questions by tags AngularJavaScript