title: Changing fxFlex value in the Component with "setAttribute('fxFlex', '25%')" not Working in Angular 6
body: <p>I'm using flexLayout module (see more in <a href="https://github.com/angular/flex-layout" rel="nofollow noreferrer">https://github.com/angular/flex-layout</a> also in <a href="https://alligator.io/angular/flex-layout/" rel="nofollow noreferrer">https://alligator.io/angular/flex-layout/</a>) to build responsive div in my Angular application and I want to set the value of fxFlex attribute from my Angular Component.
  code in the component.ts:</p>
  
  <pre><code>const nav = document.getElementById('nav2'); nav.setAttribute('fxFlex', '5%');
  </code></pre>
  
  <p>code in the html page:</p>
  
  <pre><code>&lt;div fxLayout&gt;
  &lt;div id="nav2" fxFlex="25%" class="col-md-2.5 bg-white p-1"&gt;hello&lt;/div&gt;
  &lt;div id="nav1"&gt;word&lt;/div&gt;&lt;/div&gt;
  </code></pre>
  
  <p>the code should normally should change the size Layout to 5%, but it's not the case, when i inspect the page I found that the attribute has been change but the layout still the same, <strong>oddly when i change it manually in the html code to 5%, i get the result that i wanted.</strong></p>
  
  <p>I'm using Angular 6, and Typescript 3.1.1</p>
  
  <p>Please, If there is any suggestion, do not hesitate.</p>
  
  <p>Thank You !</p>