angular - 无法绑定到“matDatepicker”,因为它不是“输入”的已知属性
问题描述
我将使用材料日期选择器控制器。但它显示一个错误。当然,我在 app.module.ts 文件中添加了 MatDatepickerModule。让我在这里向您展示我的代码的一些部分:
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
在声明组件的位置导入。
@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
导入材料组件,并在需要时在每个模块中导入此共享模块。
推荐阅读
- python-3.x - 我可以在这里应用矢量化吗?还是我应该换个角度思考这个问题?
- python - 使用python的动态网页爬虫
- java - 在这种情况下,为什么编译器不能解析实例方法的符号?
- c# - 具有两个执行不同操作的获取的 Web api
- c++ - 如何使用类模板返回和显示多个值?
- ios - Swift - 覆盖 UIViewController(模态)中的存在和关闭,以便在每次呈现或关闭视图控制器时运行一些命令?
- python - xlsxwriter 条件格式数据栏选项不起作用
- c# - 使用 Blazor 处理数据注释
- sql - 如何在 postgresql 的所有可能选项中获取随机行
- excel - VBA MS 访问第 1 行到最后一列