Question

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

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>

Option Explicit

Dim oFS    : Set oFS  = CreateObject("Scripting.FileSystemObject")
Dim sFSpec : sFSpec   = oFS.GetAbsolutePathName(".\44567515.xml")
Dim oXML   : Set oXML = CreateObject("Msxml2.DOMDocument.6.0")
oXML.load sFSpec
If 0 = oXML.parseError Then
   recursiveTraversal oXML.documentElement, 0
   WScript.Echo "------------"
   Dim sXPath : sXPath = "//add[@key='key2']"
   Dim nodes  : Set nodes = oXML.selectNodes(sXPath)
   If 0 = nodes.length Then
      WScript.Echo "no nodes for", sXPath
   Else
     WScript.Echo nodes(0).nodeName
     WScript.Echo nodes(0).getAttribute("value")
   End If
Else
   WScript.Echo objMSXML.parseError.reason
End If

Sub recursiveTraversal(oElm, nIndent)
WScript.Echo Space(nIndent), oElm.tagName
If 0 < oElm.childNodes.length Then
   Dim oChild
   For Each oChild In oElm.childNodes
       recursiveTraversal oChild, nIndent + 2
   Next
Else
   If 0 < oElm.attributes.length Then
      Dim oAttr
      For Each oAttr In oElm.attributes
          WScript.Echo Space(nIndent + 1), oAttr.name, oAttr.value
      Next
   End If
End If
End Sub

这是我在浏览器中遇到的错误：

无法绑定到＆＃39; mdDatepicker＆＃39;因为它不是一个已知的属性＆＃39;输入＆＃39;如果＆md-datepicker＆＃39;是一个Angular组件，然后验证它是这个模块的一部分。 2.如果＆md-datepicker＆＃39;是一个Web组件，然后添加＆＃34; CUSTOM_ELEMENTS_SCHEMA＆＃34;到了＆＃39; @ NgModule.schemas＆＃39;这个组件压制此消息。（＆＃34; [错误 - ＆GT;]

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

Answer 1

使用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 。

提及：请避免使用MaterialModule，以便将来弃用。

Answer 2

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

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

注意：已移除MaterialModule。请改用单独的模块。 如MdDatepickerModule 请参阅此处https://github.com/angular/material2/blob/master/CHANGELOG.md#200-beta11-carapace-parapet-2017-09-21

Answer 3

要在应用程序中使用MatDatePicker，请在 app.module.ts 文件中添加以下行：

在您的app.module.ts中导入MatDatepickerModule和MatNativeDateModule。

例如：

import { MatDatepickerModule, MatNativeDateModule } from '@angular/material';
在导入和导出的@NgModule中添加MatDatepickerModule，MatNativeDateModule：

**

@NgModule ({
            imports: [
                MatDatepickerModule,
        MatNativeDateModule 
            ],
            exports: [
                MatDatepickerModule, 
                MatNativeDateModule 
            ]
        })

**

Answer 4

在Angular8中，以下导入对我很有效

wc

Answer 5

您只需要在模块下方导入

import {MatDatepickerModule} from '@angular/material/datepicker';

@NgModule ({
  imports: [
    MatDatepickerModule
   ]
  })

Answer 6

在最新版本的 Angular Material 中，在这种情况下，您必须从 MatDatepickerModule 导入 @angular/material/datepicker，从 MatNativeDateModule 导入 @angular/material/core。

import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatNativeDateModule } from '@angular/material/core';

 @NgModule ({
   imports: [
    MatDatepickerModule,
    MatNativeDateModule
   ]
 })

无法绑定到＆＃39; matDatepicker＆＃39;因为它不是“输入”的已知属性。 - 角度

6 个答案: