我使用这个种子开始使用 Angular 2 Typescript 和 Webpack:https://github.com/haoliangyu/angular2-leaflet-starter.
我对大多数使用的工具和技术(Angular 2、Typescript、Webpack)都很陌生。虽然我对这些越来越了解,但似乎我仍然没有掌握如何第三方非类型化 JS 库被包含在内:
我想包括leaflet-routing-machine.js进入我的项目。据我所知,虽然确实存在传单的类型,但不存在传单路由机的类型。
我通过安装该包npm install
并添加了所需的快速启动代码片段显示路线。
地图服务.ts
/// <reference path="../../typings/leaflet/leaflet.d.ts"/>
import {Injectable} from 'angular2/core';
import {Map} from 'leaflet';
Injectable()
export class MapService {
map: Map; // holds reference to the normal leaflet map object
showRoute(){
L.Routing.control({
waypoints: [
L.latLng(47.569198, 7.5874886),
L.latLng(47.5685418, 7.5886755)
]
}).addTo(this.map);
}
}
我遇到的错误npm start
is:
ERROR in ./app/services/map.service.ts
(56,11): error TS2339: Property 'Routing' does not exist on type 'typeof L'.
据我了解,我不应该在index.html中包含JS文件,因为这应该由webpack自动完成。事实上,我通常不确定如何在不输入的情况下包含第三方库(答案如this没有帮助)看来我的情况有点不同,因为L
对象是标准传单,不知道Routing
财产。我以某种方式理解了这一点,因为我没有看到路由机库如何扩展传单库。
有什么建议么?
我没有使用过 Angular 2,也没有使用过 TypeScript,但我怀疑 TypeScript 不喜欢 LRM 将自身附加到L
对象/命名空间。
请注意,LRM 还将自身导出为普通的 CommonJS 模块,因此您可以执行类似的操作而不是使用L.Routing.Control
:
var L = require('leaflet');
var Routing = require('leaflet-routing-machine');
var map = L.map(...);
var routingControl = Routing.control({ ... });
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)