角度 2 材料步进器不工作

Question

嗨，我正在做一个 Angular 2 项目并大量使用材质模块。由于某种原因，我什至无法将步进模块导入我的项目。所以我最终导入了整个材料模块，如下所示：

import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { StepperComponent } from './stepper.component';
import { MaterialModule } from '@angular/material';

@NgModule({
  imports: [CommonModule, MaterialModule],
  declarations: [StepperComponent],
  exports: [StepperComponent]
})
export class StepperModule {}

我在我的 HTML 中使用它，如下所示来测试其导入的内容

<mat-horizontal-stepper></mat-horizontal-stepper>

然后我收到以下错误，

polyfills.dll.js:24743 Unhandled Promise rejection: Template parse errors:
'mat-horizontal-stepper' is not a known element:
1. If 'mat-horizontal-stepper' is an Angular component, then verify that it is part of this module.
2. If 'mat-horizontal-stepper' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("[ERROR ->]<mat-horizontal-stepper></mat-horizontal-stepper>"): t@0:0 ; Zone: <root> ; Task: Promise.then ; Value: 

我能够使用很多材料模块。唯一的问题。知道伙计们吗？提前谢谢。

Answer 1

您确定正确导入模块吗？确保在您的app.module.ts中，您有导入到MatStepperModule而不是MaterialModule（已从2.0.0-beta.11中删除，请参阅此处）：

import { MatStepperModule } from '@angular/material';
@NgModule({
    imports: [
        MatStepperModule,
        // ...
    ]
})

它不起作用的原因是步进器组件是2.0.0-beta.11新添加的（有关更多信息，请参阅更新日志，如上所述，删除了MaterialModule ）

Answer 2

我也有这个问题。

对我来说，原因是我正在阅读 Angular Material 12.1.1 的文档，该文档建议使用带有方向绑定的mat-stepper组件选择器。

在我的项目中，我实际上使用的是Angular Material 9.2.4，它使用了旧的组件mat-horizontal-stepper选择器。

因此，请尝试根据文档的相关版本检查您正在使用的 Angular Material 版本，

Answer 3

问题是，我将 Angular 引导程序与 Angular 材料一起使用。他们似乎不相互合作。这似乎是乳清它从未对我起作用的原因。

而不是mat-stepper使用mat-horizontal-stepper.