Angular google 地图不适用于 router-outlet
Angular google maps not working with router-outlet
我正在创建一个应用程序，其中一张地图为 header（全局视图），另一张地图位于页面中间，代表一些详细视图。我得到了这个工作 in this StackBlitz。
现在为了最大程度地减少代码重复，我想将 header 映射移动到 parent 组件，这样我就可以在多个页面中重复使用全局映射 header。我可以通过 Angular 路由器（children 标签）做到这一点。这意味着以下内容：
LayoutComponent (global view map) --> <router-outlet> --> HomeComponent (detail view map)
但不知何故只有 child 组件中的地图加载。我已经重现了这种行为 in this StackBlitz。
现在我想知道，我是不是做错了什么？我似乎无法找到此代码为何不起作用的任何原因。
版本
- @agm/core
1.0.0
- Angular
8.2.10
您的结构似乎有些问题。在您的 FeatureModule 中，您加载 HomeModule，并呈现 LayoutComponent。 AppComponent 和 LayoutComponent 中也有 <router-outlet>。您还需要在各自的模块中导出某些组件，以便在其他模块中使用它们。
我对结构进行了一些更改，其中 FeatureModule 加载了 HomeComponent。 appComponent 现在使用 <app-layout> 模板，布局模板将根据其路径呈现正确的组件，即空路径的 HomeComponent。现在，您有两个地图，header 将保留您加载的所有不同组件。
这里尝试解决您遇到的困难：Stackblitz
我正在创建一个应用程序，其中一张地图为 header（全局视图），另一张地图位于页面中间，代表一些详细视图。我得到了这个工作 in this StackBlitz。
现在为了最大程度地减少代码重复，我想将 header 映射移动到 parent 组件，这样我就可以在多个页面中重复使用全局映射 header。我可以通过 Angular 路由器（children 标签）做到这一点。这意味着以下内容：
LayoutComponent (global view map) --> <router-outlet> --> HomeComponent (detail view map)
但不知何故只有 child 组件中的地图加载。我已经重现了这种行为 in this StackBlitz。
现在我想知道，我是不是做错了什么？我似乎无法找到此代码为何不起作用的任何原因。
版本
- @agm/core
1.0.0 - Angular
8.2.10
您的结构似乎有些问题。在您的 FeatureModule 中，您加载 HomeModule，并呈现 LayoutComponent。 AppComponent 和 LayoutComponent 中也有 <router-outlet>。您还需要在各自的模块中导出某些组件，以便在其他模块中使用它们。
我对结构进行了一些更改，其中 FeatureModule 加载了 HomeComponent。 appComponent 现在使用 <app-layout> 模板，布局模板将根据其路径呈现正确的组件，即空路径的 HomeComponent。现在，您有两个地图，header 将保留您加载的所有不同组件。
这里尝试解决您遇到的困难：Stackblitz