Question

编辑：使用@ angular / material而不是angular-material修复。如果您不熟悉角度，请按照以下答案：）

我正在尝试将“MatToolbarModule”导入单个导航栏组件，以便在角项目中的navbar.component.html中使用它，但这似乎不起作用。在“app.module.ts”中导入模块并在index.html中使用它可以正常工作。

这是我的navbar.component.ts：

import {NgModule} from '@angular/core';
import {MatToolbarModule} from 'angular-material';

@NgModule({
imports: [MatToolbarModule]
})
//Component decorator and rest of code is untouched

在我的navbar.component.html中：

<mat-toolbar>MyTitle</mat-toolbar>

我得到的错误：“如果'mat-toolbar'是一个Angular组件，那么请确认它是该模块的一部分。”

我正在使用角度5和最新版本的角度材料及其依赖。谢谢！

Answer 1

您必须导出您在模块中导入的所有内容，它是一个功能模块。

// moved this to independent file keeping the app.module cleaner
import { NgModule } from '@angular/core';
import {
    MatCheckboxModule,
    MatInputModule,
    MatSelectModule,
    MatRadioModule,
    MatMenuModule,
    MatToolbarModule,
    MatListModule,
    MatGridListModule,
    MatCardModule,
    MatTabsModule,
    MatButtonModule,
    MatChipsModule,
    MatIconModule,
    MatProgressSpinnerModule,
    MatProgressBarModule,
    MatDialogModule,
    MatTooltipModule,
    MatSnackBarModule,
    MatSlideToggleModule,
    MatTableModule,
    MatPaginatorModule,
    MatSortModule,
    MatAutocompleteModule,
    MatExpansionModule
} from '@angular/material';

const materialModules = [
    MatCheckboxModule,
    MatInputModule,
    MatSelectModule,
    MatRadioModule,
    MatMenuModule,
    MatToolbarModule,
    MatListModule,
    MatGridListModule,
    MatCardModule,
    MatTabsModule,
    MatButtonModule,
    MatChipsModule,
    MatIconModule,
    MatProgressSpinnerModule,
    MatProgressBarModule,
    MatDialogModule,
    MatTooltipModule,
    MatSnackBarModule,
    MatSlideToggleModule,
    MatTableModule,
    MatPaginatorModule,
    MatSortModule,
    MatAutocompleteModule,
    MatExpansionModule
];

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

Answer 2

好的，回答你的问题，我重新创建了你的案子，一切正常。所以我会提供一些步骤，也许你错过了一些东西。

创建模块;
导入的材料模块，添加到导入;
导入所需的组件，添加声明;
将所有模块导入app.module并在BrowserAnimationsModule,BrowserModule之后添加到导入。
在我的html中创建了一些mat组件，并且都为我工作。

在单个组件

2 个答案: