本文介绍了无法绑定到“matDatepicker",因为它不是“input"的已知属性的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我将使用材料日期选择器控制器.但它显示一个错误.当然,我在 app.module.ts 文件中添加了 MatDatepickerModule.让我在这里向您展示我的代码的一些部分:
I am going to use a material date picker controller. But it shows an error.Of course, I added MatDatepickerModule in app.module.ts file.Let me show you some parts of my code here:
import { MatDatepickerModule } from '@angular/material/datepicker';
...
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
AppRoutingModule,
...,
MatDatepickerModule,
SharedModule.forRoot(),
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule {}
这是html代码:
<mat-form-field appearance="fill">
<mat-label>Event start time</mat-label>
<input matInput [matDatepicker]="picker">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
</mat-form-field>
以下是错误日志:
Error: src/app/.../test.component.html:67:31 - error NG8002: Can't bind to 'matDatepicker' since it isn't a known property of 'input'.
67 <input matInput [matDatepicker]="picker">
我错过了什么?
推荐答案
您必须在声明组件的位置导入 MatDatepickerModule
.
You have to import MatDatepickerModule
where your components are declared.
@NgModule({
declarations: [
AppComponent //Date picker is only available in this component
],
imports: [
...
MatDatepickerModule
]
})
export class AppModule {}
假设你有 hallway.module
@NgModule({
declarations: [
HallwayComponent
],
imports: [
...
MatDatepickerModule //Import it here too, to make it available in Hallway component
]
})
export class HallwayModule {}
您还可以创建 shared.module
或 material-shared.module
并在其中导入材料组件,并在需要时在每个模块中导入此共享模块.
You can also create shared.module
or material-shared.module
and import material components in it and import this shared module in every module wherever required.
这篇关于无法绑定到“matDatepicker",因为它不是“input"的已知属性的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!