Fügen Sie Google Font in Angular 2 + Meteor Anwendung

Newb zu Angular 2.Fügen Sie Google Font in Angular 2 + Meteor Anwendung

Wie Google Schrift in meiner App schließen. App Struktur

Client
ist | --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>

inklusive Link in head-Tag

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

aber keine Wirkung aufgetreten ist, schaffte auch eine JS-Datei im Client-Ordnern (font.js) und eingegebene Code

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); 
    })(); 

})

aber keine Wirkung.

rechter Weg, um diese Schrift in meiner Angular 2 + Meteor Anwendung schließen

Quelle

2016-06-07 Sandeep Chikhale

Sie die Schriftfamilie in die CSS enthalten haben aufgenommen haben? – Rudy

I Inline-CSS innerhalb Body-Tag –

Sonderbare aufgenommen haben, sollte der Link in den Kopf arbeiten. Weil ich so arbeite, funktioniert es richtig. –

gefunden Lösung mit @import
diesen Code in common_style.css Datei eingefügt, die ich in der öffentlichen Ordnern abgelegt

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

Und dann auf app.ts - Haupt loader Typoskript Datei ich den Stil

@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 ] 
})

und bekam Stil auf allen Seiten

Quelle

2016-06-07 18:51:07

Fügen Sie Google Font in Angular 2 + Meteor Anwendung

Antwort

Verwandte Themen