Dołącz czcionkę Google w aplikacji Angular 2 + Meteor

Newb to Angular 2.Dołącz czcionkę Google w aplikacji Angular 2 + Meteor

Jak uwzględnić czcionkę Google w mojej aplikacji. Struktura aplikacji jest

klient
| --app.ts
| --main.ts
| --index.html

IndexFile.html

<head></head> 
<body style="font-family: 'Montserrat', sans-serif;"> 
    <div class="container-fluid"> 
     <app-start>Loading...</app-start> 
    </div> 
</body>

wliczony ogniwem w głowicy tagu

<link href='https://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>

ale nie wystąpił efekt, stworzony również plik JS w folderze klienta (font.js) i kod wstawiony

Meteor.startup(function() { 

    WebFontConfig = { 
    google: { families: [ 'Montserrat::latin' ] } 
    }; 
    (function() { 
    var wf = document.createElement('script'); 
    wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js'; 
    wf.type = 'text/javascript'; 
    wf.async = 'true'; 
    var s = document.getElementsByTagName('script')[0]; 
    s.parentNode.insertBefore(wf, s); 
    })(); 

})

ale bez skutku.

Prawy sposób włączenie tej czcionki w moim Kątowymi 2 + Meteor Aplikacja

Źródło

2016-06-07 Sandeep Chikhale

masz obejmują rodzinę czcionek w css? – Rudy

Mam wbudowany CSS wewnątrz znacznika body –

Dziwne, link w głowie powinien działać. Ponieważ używam w ten sposób, działa poprawnie. –

Znaleziono rozwiązanie używając @import
dodała ten kod w pliku common_style.css które umieściłem w folderze publicznym

@import url(https://fonts.googleapis.com/css?family=Montserrat);

A potem na app.ts - głównego pliku ładowarka maszynopis mam włączone styl

@Component({ 
    selector:'app-start', 
    template:` 
     <div style=" font-family: 'Montserrat', sans-serif;"> 
     <navbar></navbar> 
     <router-outlet></router-outlet> 
     <footer></footer> 
     </div> 
    `, 
    directives : [ NavbarComponent,FooterComponent, ROUTER_DIRECTIVES ], 
    providers : [ ROUTER_PROVIDERS ] 
})

, ale styl na wszystkich stronach

Źródło

2016-06-07 18:51:07

Dołącz czcionkę Google w aplikacji Angular 2 + Meteor

Odpowiedz

Powiązane problemy