角度 6 与材料设计垫工具栏问题

Question

我正在用 angular 6 和材料做一个小教程。我的代码：

.HTML：

<mat-toolbar>
<span>Angular 6 Mean Stack Sample</span>
</mat-toolbar>
<div>
<router-outlet></router-outlet>
</div>

app-module.ts：

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {MatToolbarModule} from '@angular/material';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ListComponent } from './components/list/list.component';
import { CreateComponent } from './components/create/create.component';
import { EditComponent } from './components/edit/edit.component';
@NgModule({
declarations: [
AppComponent,
ListComponent,
CreateComponent,
EditComponent,
MatToolbarModule
],
imports: [
BrowserModule,
AppRoutingModule,
BrowserAnimationsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

在 html 部分中，我从我的 ide 收到此错误：

NG："mat-toolbar"不是一个已知的元素： 如果"mat-toolbar"是一个 Angular 组件，那么验证它是否是这个模块的一部分。

当我启动程序时，一切正常，但我的屏幕上什么也没看到。来自 Web 控制台的错误是：

错误：模块"AppModule"声明的意外模块"MatToolbarModule"。请添加 @Pipe/@Directive/@Component 注释。

我重新安装了所有内容，从头开始了该项目，但没有任何帮助。如果有人能帮助我，我会很棒，

谢谢

汤姆

Answer 1

将模块MatToolbarModule从数组declarations移动到imports数组。Modules只能导入，其中声明了components。

imports: [
BrowserModule,
AppRoutingModule,
MatToolbarModule,
BrowserAnimationsModule
]