[英]Template Parse Error: 'mat-sidenav-container' is not a known element, and about router-outlet, ngif
[英]Template Parse Error: 'mat-sidenav-container' is not a known element
我是 Angular/material2 的新手,我不确定我在尝试遵循sidenav
上的文档时sidenav
。
在我的 AppComponent 中,我想显示一个 sidenav,我已经实现如下:
app.component.tss
import {
NgModule,
Component
} from '@angular/core';
import {
MatSidenavModule,
MatSidenavContent,
MatSidenav
} from '@angular/material';
import {
BrowserAnimationsModule
} from '@angular/platform-browser/animations';
@NgModule({
imports: [
BrowserAnimationsModule,
MatSidenav
],
exports: [
BrowserAnimationsModule,
MatSidenav
]
})
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'app';
}
应用程序组件.html
<!--The content below is only a placeholder and can be replaced.-->
<mat-sidenav-container>
</mat-sidenav-container>
<div style="text-align:center">
<h1>
Welcome to {{ title }}!
</h1>
<nav>
<a routerLink="/clients">Clients</a>
</nav>
<router-outlet>
</router-outlet>
</div>]
错误是:
Uncaught Error: Template parse errors:
'mat-sidenav-container' is not a known element:
1. If 'mat-sidenav-container' is an Angular component, then verify that it is part of this module.
2. If 'mat-sidenav-container' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message
我的代码中缺少什么?
Sajeetharan 的答案不适用于较新版本的角材料。
从这里:
MaterialModule 在 2.0.0-beta.3 版本中被弃用,它在 2.0.0-beta.11 版本中被完全删除......
所以,要解决这个问题:
在 2.0.0-beta.3 后:
import {
MatSidenavModule,
} from '@angular/material';
@NgModule({
exports: [MatSidenavModule],
imports: [
MatSidenavModule
],
})
在旧版本中:
@NgModule({
imports: [
MaterialModule
],
})
您需要import { MaterialModule } from './material.module';
导入import { MaterialModule } from './material.module';
在 app.module.ts
imports: [
MaterialModule
]
由于material module
已折旧,因此您需要使用 Angular 最新版本
import { MatSidenavModule } from '@angular/material/sidenav';
Angular 9 实现
import { MatSidenavModule } from '@angular/material/sidenav';
imports: [MatSidenavModule]
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.