how to update childView element height

I want to update each item height in *ngFor elements' based on the tallest item. The idea was to get each height from ViewChild, then emit output to container, and then push it (or via observable service) to the child and then update height of the child to get the same height and nice summary on the same line. Of course famous ExpressionChangedAfterItHasBeenCheckedError came out. Not very familiar with ViewChild/Children and everyone says about NOT changing it in AfterViewInit but where should I do and how to solve it properly? What's different is that in Stackblitz I don't get this error, but still don't know how to solve the problem..?

code: stackblitz source code

The AfterViewInit error - NG100 is a common angular error. Basically, it means that you are trying to change some visual element (this can height of an element or something like the value of an interpolated string) after change detection has run.

Unfortunately, just from the stackblitz and without being able to reproduce the error, it is difficult to debug.

Regarding the original question, it can be achieved purely with css. Simply add the following classes to the app item component:

:host {
  display: flex;
  height: 100%;
}

// Replace your old container class with this
.container {
  flex-grow: 1;

  padding: 5px;
  margin: 5px;

  border: 3px dotted dodgerblue;
}