Angular 在单个组件上导入anuglar材质模块

编辑：通过使用@angular/material而不是angular material进行修复。如果您不熟悉角度，请遵循以下答案：）

我正在尝试将“MatToolbarModule”导入到单个navbar组件中，以便在angular项目的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

在my navbar.component.html中：

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

MyTitle

错误信息：“如果‘mat toolbar’是一个角度组件，请确认它是此模块的一部分。”

我正在使用angular 5和angular material的最新版本及其依赖项。

---

谢谢大家!

好的，回答你的问题，我重新创建了你的案例，一切都很好。 所以我会提供步骤，也许你遗漏了什么

创建模块

导入的物料模块，添加到导入中

导入需要的组件到它，添加它做声明

已将所有模块导入到

app.module

，并在

BrowserAnimationsModule、BrowserModule

之后添加到导入中

在我的html中创建了一些mat组件，所有这些都为我工作

---

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

// 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 { }

---

在材质文档上，从“@angular/material/toolbar导入{MatToolbarModule}”如下所示。或者我遗漏了什么？我使用的包是棱角材料，相同的导入行在app.module.ts/w index.html中运行良好。如果您确定这是正确的方式，谢谢您的回答。我会试着找出我遗漏了什么：）这样做并将其导入app.module使其在项目中的每个组件中都可用？是的，我在我的项目中也做了同样的事情，但你问了具体的情况）事实上这是必须做到的。我看到你们甚至在网站上使用@angular/material，这就是他们正在使用的。我会试着用那个软件包，让你知道。很好，但没问题。这是另一个问题的答案）无论如何，如果它有帮助，我很高兴