角度の材料Datepickerは私のために働きません

Question

私は日付ピッカーを使用しようとしています。チェックボックスやラジオボタンに問題はありません。しかし、私は試してみて、日付ピッカーを追加し、私はいつもこのエラーを取得する場合：私のapp.module.tsファイル内

Error: Template parse errors: Can't bind to 'htmlFor' since it isn't a known property of 'md-datepicker-toggle'

：

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { MdButtonModule, 
    MdCheckboxModule, 
    MdCardModule, 
    MdRadioModule, 
    MdDatepickerModule } from '@angular/material'; 

import { AppComponent } from './app.component'; 
import { WeekControlComponent } from './week-control.component'; 

@NgModule({ 
declarations: [ 
    AppComponent, 
    WeekControlComponent 
], 
imports: [ 
    BrowserModule, 
    FormsModule, 
    MdButtonModule, 
    MdCheckboxModule, 
    MdCardModule, 
    MdRadioModule, 
    MdDatepickerModule 
], 
providers: [], 
bootstrap: [AppComponent] 
}) 
export class AppModule { } 

を私はWeekControlComponentを持っている：

HTML

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

TS

import { Component, OnInit } from '@angular/core'; 

    @Component({ 
    selector: 'app-week-control', 
    templateUrl: './week-control.component.html', 
    styleUrls: ['./week-control.component.css'] 
    }) 
    export class WeekControlComponent implements OnInit { 

    constructor() { } 

    ngOnInit() { 
    } 
    } 

私はcopie d。angular.ioの素材の例のページの例をそのまま表示します。私はなぜそれが機能していないのか理解していない。誰かがここで私を助けてくれますか？

Answer 1

最新の角度依存関係をインストールするだけです。すなわち

"@angular/animations": "4.3.0", 
"@angular/cdk": "^2.0.0-beta.10", 
"@angular/common": "4.3.0", 
"@angular/compiler": "4.3.0", 
"@angular/core": "4.3.0", 
"@angular/forms": "4.3.0", 
"@angular/http": "4.3.0", 
"@angular/material": "^2.0.0-beta.10", 
"@angular/platform-browser": "4.3.0", 
"@angular/platform-browser-dynamic": "4.3.0", 
"@angular/platform-server": "4.3.0", 
"@angular/router": "4.3.0" 

devDependencies: 
"@angular/compiler-cli": "4.3.0" 

コードをテストしてください。それは私のためにうまく動作します。

Answer 2

あなたが材料バージョン2.0.0-beta.8を使用している場合は、次の変更を実行する必要があります -

1. は、HTMLファイル

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

2のコードを置き換えます。 app.module、つまりMdNativeDateModuleにモジュールをもう1つ追加してください。

import { MdButtonModule, 
MdCheckboxModule, 
MdCardModule, 
MdRadioModule, 
MdDatepickerModule, 
MdNativeDateModule } from '@angular/material'; 


imports: [ 
    BrowserModule, 
FormsModule, 
MdButtonModule, 
MdCheckboxModule, 
MdCardModule, 
MdRadioModule, 
MdDatepickerModule, 
MdNativeDateModule 

]、