title: Use variable in style tag in angular template?
body: <p>I am working on angular 5 application, and I have requirement of applying dynamic css in style tag in template.
  I have tried some solutions but they are not working.</p>
  
  <p>app.component.ts</p>
  
  <pre><code>customCss : any;
  
  constructor(){}
  
  ngOnInit(){
     this.customCss['color'] = "red";
  }
  </code></pre>
  
  <p>app.component.html</p>
  
  <pre><code>&lt;div&gt;
     &lt;span class="custom_css"&gt;This is angular 5 application&lt;/span&gt;
  &lt;/div&gt;
  
  &lt;style&gt;
     .custom_css{
        color: {{customCss.color}};
     }
  &lt;/style&gt;
  </code></pre>
  
  <p>When I inspect the custom_css class in browser then in style it shows </p>
  
  <pre><code>.custom_css{
     color: {{customCss.color}};
  }
  </code></pre>
  
  <p>Any help is appreciated.</p>