angular - 将自定义组件与材料设计组件分开导入时，Angular7按钮不呈现

Question

我正在玩有角度的材料设计，并注意到一些奇怪的东西。我有一个带有路由器的简单应用程序、一个登录组件和两个共享模块：

• 材料设计模块（导入/导出所有材料设计组件）
• 自定义组件模块（导入/导出所有自定义组件，在我的情况下它只有一个）

共享模块被导入到路由器中。当从材料设计模块导出登录组件时，登录按钮正确呈现。问题是当我从自定义组件模块导出登录组件时 - 然后登录按钮不会呈现为材料设计组件。

我准备了两个 stackblitz 示例来说明这一点：

https://stackblitz.com/edit/angular-mat-ok?embed=1&file=src/app/app.component.ts - 这里的按钮样式为材料设计按钮。

https://stackblitz.com/edit/angular-mat-not-ok?embed=1&file=src/app/app.component.ts - 这里的按钮呈现为正常，而不是样式按钮。

有人能告诉我从自定义组件模块导入按钮时为什么不能正确呈现的原因吗？我打算使用该模块对应用程序中的自定义组件进行分组和分发。

标签： angularmaterial-design

Answer 1

LoginFormComponent 位于 CustomComponentsModule 中，并在其中寻找其他组件和指令来呈现。为了能够使用 MaterialComponentsModule 中的材质按钮，您应该将 MaterialComponentsModule 导入到 CustomComponentsModule