Dynamic @font-face in ng-style
<p>I have specifics fonts that will be tied to user layouts. When a user logs in, they will see their selected fonts which will be loaded from the server.
I will be using Angular to style the specific elements. How can I use @font-face in ng-style? Is it possible?</p>

<p>font-family works if I type all the possible font-faces prior which is tedious and hard to maintain. the CSS is the section I want to load dynamically based on the user's fonts</p>

<pre><code>**CSS** 

@font-face {
    font-family: CustomFontName;
    src: url('CustomFont.ttf');
}

@font-face {
    font-family: CustomFontName2;
    src: url('CustomFont2.ttf');
}

**JS**

textbox.style = {
  'font-family': CustomFontName
}

**HTML**

&lt;p ng-style="textbox.style"&gt;{{ textbox.placeholder }}&lt;/p&gt;
</code></pre>

<p>The website is <a href="http://new.nameprintgraphics.com" rel="nofollow">here</a>, you can test it out with validation code "ImprintPlus" and then change templates. the user will want their customized fonts in there.</p>