某些库的命名空间可能需要全局注入,比如jquery的$,openlayer的ol等等,我们使用declare关键字可以搞定这件事。
先在index.html模板中引入库:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>NgRouter</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<script src="assets/libs/ol.js"></script>
<link rel="stylesheet" href="assets/libs/ol.css">
</head>
<body>
<app-root></app-root>
</body>
</html>
在需要使用的地方声明:
import { Component, OnInit } from '@angular/core';
declare var ol:any; // 声明全局变量
@Component({
selector: 'app-example',
templateUrl: './example.component.html',
styleUrls: ['./example.component.scss']
})
export class ExampleComponent implements OnInit {
constructor() { }
ngOnInit(): void {
console.log(ol);
}
}
网友评论