Bao gồm Google Font trong Angular 2 + Ứng dụng Meteor

Newb to Angular 2.Bao gồm Google Font trong Angular 2 + Ứng dụng Meteor

Cách bao gồm phông chữ của Google trong ứng dụng của tôi. App Cấu trúc là

client
| --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>

liên kết Bao gồm trong thẻ đầu

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

nhưng không ảnh hưởng gì đã xảy ra, cũng tạo ra một tập tin JS trong thư mục client (font.js) và chèn một mã

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

})

Nhưng không có hiệu lực.

Ngay cách để bao gồm phông chữ này trong góc 2 + Meteor Ứng dụng của tôi

Nguồn

2016-06-07 Sandeep Chikhale

có bạn bao gồm họ phông chữ vào css? – Rudy

Tôi đã bao gồm CSS nội dòng bên trong thẻ body –

Lạ, liên kết trong đầu sẽ hoạt động. Bởi vì tôi đang sử dụng theo cách này, nó hoạt động tốt. –

Tìm thấy giải pháp sử dụng @import
chèn mã này trong tập tin common_style.css mà tôi đặt trong thư mục công cộng

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

Và sau đó trên app.ts - chính tập tin nạp nguyên cảo Tôi đã bao gồm phong cách

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

và phong cách có trên tất cả các trang

Nguồn

2016-06-07 18:51:07

Bao gồm Google Font trong Angular 2 + Ứng dụng Meteor

Trả lời

Các vấn đề liên quan