2017-11-17 5 views
0

私はカレンダーのドロップダウンを持って、それは働いています。しかし、私はそれにデフォルトの日付を提供したい。どのようにそれを行うことができます。次のように私の構成要素である後どのようにprimengの​​日付のデフォルト値を提供する

次のように

import {HttpClient} from '@angular/common/http'; 
import { Component, OnInit } from '@angular/core'; 
import { routerTransition } from '../../router.animations'; 
import { isNumber } from '@ng-bootstrap/ng-bootstrap/util/util'; 

@Component({ 
    selector: 'app-dashboard', 
    templateUrl: './dashboard.component.html', 
    styleUrls: ['./dashboard.component.scss'], 
    animations: [routerTransition()] 
}) 
export class DashboardComponent implements OnInit { 
    value= new Date(); 
    today_date: string; 

    ngOnInit() { 
     this.today_date = this.value.getFullYear() + '-' + this.value.getMonth() + '-' + this.value.getDate(); 
     console.log(this.today_date) 
    } 
} 

HTMLコードは次のとおりです。

<div> 
    <p-calendar (ngModel)="today_date" [inputStyle]="{'width':'100%'}" dateFormat="yy-mm-dd"></p-calendar> 
</div> 

それは、日付アップピッキングされていません。 Console.log outは '2017/10/17'

答えて

1

私の理解しているように、p-calendarの値はDateです。したがって、文字列は機能しません。ここで私が私のために持っているものは、それはかなりうまくいく:

TS 
import * as moment from "moment"; //I use MomentJS and I recommend it also. The snippet is based on MomentJS as well. 
calendarDate: Date; 
ngOnInit() { 
this.calendarDate = moment().toDate(); 
} 

HTML 
<p-calendar [ngModel]="calendarDate"></p-calendar> 

EDIT:あなたのHTMLテンプレートに間違った構文があります。 (ngModel)は意味をなさない。プロパティーバインドの場合は[ngModel]、イベントバインドの場合は(ngModelChange)、双方向バインディングの場合は[(ngModel)]である必要があります。

関連する問題