时间戳

首页 > 解决方案 > 将 @angular/material 与 Angular 9 一起使用会引发错误

angular - 将 @angular/material 与 Angular 9 一起使用会引发错误

问题描述

我最近将我的应用程序从 Angular 8 升级到了 Angular 9。

今天我尝试安装 Angular Material。我按照官方说明使用ng add @angular/material，然后导入MatChipsModule。

但是启动应用程序会出现以下错误（是的，我尝试删除 node_modules 并从头开始安装所有内容）：

在此处输入图像描述

上述错误是针对 MatAutoCompleteModule 的，但对于所有角度材料模块，我都会遇到相同的错误。

我正在运行 Angular 9.1.2 版和 Angular Material 9.2.3 版。

我在其中导入材料模块的 Angular 模块：

const contactsEffects = [
  ContactEffects,
  ContactSalesMeetingsEffects,
  ConsentsEffects,
  ContactSearchProfileEffects,
];

@NgModule({
  imports: [
    EffectsModule.forFeature(contactsEffects),
    CommonModule,
    ReactiveFormsModule,
    ModalModule,
    TooltipModule,
    ProgressbarModule,
    BsDropdownModule,
    TranslateModule,
    MomentModule,
    SkeletonScreenModule,
    ContactsRoutingModule,
    NguiMapModule,
    ActionListModule,
    CreateContactModule,
    ListComponentsModule,
    UiComponentsModule,
    ResourceModule,
    UtilModule,
    SidebarSharedModule,
    ContactActionsWidgetModule,
    HintModule,
    FormComponentsModule,
    AddContactToCallingListModule,
    MatChipsModule,
    MatAutocompleteModule,
    MatFormFieldModule,
  ],
  exports: [
    ContactCardDetailsComponent,
    CreateNoteComponent,
    ContactNextStepComponent,
    ContactActionsWidgetComponent,
    ContactOverviewComponent,
  ],
  declarations: [
    ContactsComponent,
    ContactOverviewComponent,
    ContactActionsComponent,
    ContactNextStepComponent,
    ContactNextStepListItemComponent,
    ContactResidencesComponent,
    ContactResidenceComponent,
    ContactCardDetailsComponent,
    CreateNoteComponent,
    ProfileProgressModalComponent,
    ContactCardDetailsComponent,
    ContactSalesMeetingsComponent,
    ContactSalesMeetingsListItemComponent,
    ContactSalesMeetingsDetailCardComponent,
    ContactSalesMeetingsDetailEmptyComponent,
    ContactInfoRowComponent,
    ContactsSalesMeetingsNoEditModalComponent,
    ContactCardActionsComponent,
    CreateNewResidenceModalComponent,
    ContactOwnsResidenceComponent,
    ProfileResidenceMenuItemComponent,
    ContactCardDetailsLoadingComponent,
    ContactNextStepLoadingComponent,
    CallListModeHeaderComponent,
    ContactConsentsComponent,
    ConsentsListComponent,
    ConsentsSidebarComponent,
    ContactSearchProfilePageComponent,
    SearchProfileCardComponent,
    SearchProfileDetailsComponent,
    RelatedObjectsCardComponent,
    RelatedObjectItemComponent,
    SurveysModalComponent,
    NpsDetailsModalComponent,
    ContactTagsComponent,
  ],
  providers: [ContactOverviewEffects],
})
export class ContactsModule {}

标签： angularangular-materialangular9

解决方案

事实证明，我的 Angular 和 Material 版本不兼容。对于 Angular 9.1.2 版，我必须使用 angular/material 9.1.0 版。

推荐阅读