Material 调用 leaflet Marker 的 onClick 时对话框卡住
Material Dialog gets stuck when called onClick of leaflet Marker
我有一个项目，其中有一张地图（使用 ngx-leaflet ）。
在 单击 的标记上，我想显示来自 Angular Material 的对话框。
对话框打开，但当我单击关闭按钮时，它再次打开然后关闭。
我尝试了什么：
- 使用 Timeout 延迟对话
- 触发打开对话框的主题
- 正在删除并创建一个新对话框
- 正在ngx-leaflet issues和angular-material
中搜索这个错误
我发现了什么：
- 所有的Lifecycle Hooks都是在某些事情发生后触发的（点击，后面的js事件，任何事情）
- Dialog可以简单到我想要的，它不会改变任何东西
- 当我在对话框关闭时再次打开对话框（在对话框的 afterClosed 中）它正常工作
示例代码的进一步说明：
- 在 App.component.ts 中，我将事件处理程序绑定到每个标记，然后在另一个函数中打开对话框
- 该代码是 this project i found on the net 的分支（仅具有更新的依赖项）
演示
我在这里做了一个演示：Example Project。
原因是您在 "Angular World" 之外触发了模态的打开，因为它与 google 地图标记上的 click 事件相关联。然后你有这些类型的不一致。
2 个解决方案：
- 使用 agm-map 将 angular 化 google 映射 API 的库
- 继续直接使用 google 地图 API，但添加 NgZone 以明确告诉您要在 angular 世界中执行一些代码：
m.addEventListener("click", ()=> {
this.zone.run(() => {this.openExampleDialog();})
})
我有一个项目，其中有一张地图（使用 ngx-leaflet ）。
在 单击 的标记上，我想显示来自 Angular Material 的对话框。
对话框打开，但当我单击关闭按钮时，它再次打开然后关闭。
我尝试了什么：
- 使用 Timeout 延迟对话
- 触发打开对话框的主题
- 正在删除并创建一个新对话框
- 正在ngx-leaflet issues和angular-material 中搜索这个错误
我发现了什么：
- 所有的Lifecycle Hooks都是在某些事情发生后触发的（点击，后面的js事件，任何事情）
- Dialog可以简单到我想要的，它不会改变任何东西
- 当我在对话框关闭时再次打开对话框（在对话框的 afterClosed 中）它正常工作
示例代码的进一步说明：
- 在 App.component.ts 中，我将事件处理程序绑定到每个标记，然后在另一个函数中打开对话框
- 该代码是 this project i found on the net 的分支（仅具有更新的依赖项）
演示
我在这里做了一个演示：Example Project。
原因是您在 "Angular World" 之外触发了模态的打开，因为它与 google 地图标记上的 click 事件相关联。然后你有这些类型的不一致。
2 个解决方案：
- 使用 agm-map 将 angular 化 google 映射 API 的库
- 继续直接使用 google 地图 API，但添加 NgZone 以明确告诉您要在 angular 世界中执行一些代码：
m.addEventListener("click", ()=> {
this.zone.run(() => {this.openExampleDialog();})
})