title: Angular7 component view collapsing on data manipulation
body: <p>I am experiencing the strangest issue. I do have a component that's style is controlled by some object it's handling. As the object is manipulated (by some inner component click), the whole view collapses to a height of 0.</p>
  
  <p>I have tried to apply the view changes via ngStyle, ngClass, plain ol'javascript - but nothing ever worked. Second strange thing - handling outer component's component styles is perfectly working.</p>
  
  <p><strong>Object</strong></p>
  
  <pre><code>const valueMap = {
    width: '100%',
    ...
  }
  </code></pre>
  
  <p><strong>Pseudo Component Tree</strong></p>
  
  <pre><code>&lt;component-a&gt;
    &lt;component-b [ngStyle]="{'width': valueMap.width} [valueMap]="valueMap"&gt;
      &lt;div (click)="changePosition()"&gt;Button&lt;/div&gt;
    &lt;/component-b&gt;
  &lt;/component-a&gt;
  </code></pre>
  
  <p><strong>Method</strong></p>
  
  <pre><code>changePosition() {
    this.valueMap.width = this.valueMap.width==='100%' ? '50%' : '100%';
  }
  </code></pre>
  
  <p>I would really expect the component-b to collapse to a width of 50%, but not having the height collapse to zero. I can see in the code, that as I click the button the style is applied to the element - and if in Chrome DevTools I deactivate the applied style and activate it again, it is showing properly. Never had something like this. Can someone please help?</p>
  
  <p>Thanks in advance. André</p>