首页 文章

可以't bind to ' matDatepicker ' since it isn' t已知属性'input' - Angular

提问于
浏览 次
19

我刚刚复制并粘贴了datePicker和输入的角度材料代码，但是我收到了datePicker的错误 .

app.module

import {MaterialModule} from '@angular/material';
@NgModule({
imports: [
...
MaterialModule
]

<md-input-container>
    <input mdInput placeholder="Rechercher" [(ngModel)]="filterHistorique">
</md-input-container>

<md-input-container>
    <input mdInput [mdDatepicker]="picker" placeholder="Choose a date">
    <button mdSuffix [mdDatepickerToggle]="picker"></button>
</md-input-container>
<md-datepicker #picker></md-datepicker>

这是我在浏览器中出现的错误：

无法绑定到'mdDatepicker'，因为它不是'input'的已知属性如果'md-datepicker'是Angular组件，则验证它是否是此模块的一部分 . 2.如果'md-datepicker'是Web组件，则将“CUSTOM_ELEMENTS_SCHEMA”添加到此组件的'@NgModule.schemas'以禁止显示此消息 . （“[错误 - >]

错误是针对datepicker，当我删除它时，错误消失

angular angular-material angular-material2

2 回答

  • 2

    在使用 mat-datepicker 时，您还必须导入 MatDatepickerModule ，同时也建议导入 MatNativeDateModule . 见文档 here .

    import { MaterialModule, MdDatepickerModule, MdNativeDateModule } from '@angular/material';
@NgModule({
  imports: [
    ...
    MaterialModule,            // <----- this module will be deprecated in the future version.
    MatDatepickerModule,        // <----- import(must)
    MatNativeDateModule,        // <----- import for date formating(optional)
    MatMomentDateModule         // <----- import for date formating adapted to more locales(optional)
  ]

    有关日期格式化的可选模块，请参阅材料团队的 Module for DateAdapter .

    Mention ：请避免使用 MaterialModule 因为它将来会被弃用 .

    回复于
  • 23

    如果您使用NgModule和formgroup，则需要导入 FormsModule 和 ReactiveFormsModule . 所以你的app.module应该是这样的

    import {MaterialModule} from '@angular/material';
@NgModule({
  imports: [
    MdDatepickerModule,        
    MdNativeDateModule,
    FormsModule,
    ReactiveFormsModule
  ]

    Note: MaterialModule Removed. please use separate module instead. like MdDatepickerModule 见这里https://github.com/angular/material2/blob/master/CHANGELOG.md#200-beta11-carapace-parapet-2017-09-21

    回复于

相关问题