这是我尝试将 Leaflet Maps 集成到 Angular 应用程序并组装一些 Leaflet 插件时的学习笔记。ngx-leaflet 库在过去两年里发展了很多，尤其是今年从 13.x 版本开始。它现在更易于使用，同时它也使许多经常看到的教程文档过时。我很高兴在不浪费太多时间的情况下找出可运行的解决方案。希望这篇笔记对那些遇到可能问题的人有所帮助。

首先，创建一个新的 Angular 应用程序：

npx @angular/cli new angular-leaflet-demo --style=css --routing=false --skip-tests

实施Leaflet

安装包：

npm install leaflet
npm install @asymmetrik/ngx-leaflet

在 app.module.ts 中：

import { LeafletModule } from '@asymmetrik/ngx-leaflet';
imports: [...LeafletModule
]

在angular.json中添加Leaflet CSS如下（注意leaflet.css需要在styles.css之前）：

{..."styles": ["./node_modules/leaflet/dist/leaflet.css","styles.css"],...
}

创建地图组件：

npx @angular/cli generate com