San*_*ale 9 javascript fonts meteor angular2-meteor angular
Newb to Angular 2.
如何在我的应用中加入Google字体.应用结构是
客户端
| --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>
头标记中包含的链接
<link href='https://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
但是没有发生任何影响,还在客户端文件夹(font.js)中创建了一个JS文件并插入了代码
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);
})();
})
但没有效果.
在Angular 2 + Meteor应用程序中包含此字体的正确方法
San*_*ale 17
使用@import找到解决方案
在common_style.css文件中插入此代码,该文件放在公共文件夹中
客户端
| --app.ts
| --main.ts
| --index.html
public
| --styles
| --common_style.css
@import url(https://fonts.googleapis.com/css?family=Montserrat);
然后在app.ts - main loader typescript文件中我已经包含了样式
@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 ]
})
并在所有页面上获得了风格