如何在primeng中设置日期范围的值答案

【问题标题】：How to set values for date range in primeng如何在primeng中设置日期范围的值
【发布时间】：2019-11-19 00:58:45
【问题描述】：

我正在尝试使用primeng datepick 日历在初始化表单期间设置值但不工作。我正在使用角度8 工作。我使用primeng 创建了自定义日期选择器组件。我在下面给出了我的代码。如何设置日期范围值？任何人都可以有想法？请帮助找到解决方案。

app.component.html：

<p-calendar  
    [(ngModel)]="datesRangeFilter"
    selectionMode="range" view="month" dateFormat="mm/yy" [readonlyInput]="true"
    [showIcon]="true">
</p-calendar>

app.component.ts：

datesRangeFilter:Date;

 ngOnInit(){

  let yesterday = ( d => new Date(d.setDate(d.getDate()-1)) )(new Date);

  this.datesRangeFilter=yesterday +'-'+new Date;

 }

【问题讨论】：

标签： angular7 primeng angular8

【解决方案1】：

您可以将两个不同的日期分配为一个数组，它将绑定到模型。

component.html

<hello name="{{ name }}"></hello>
<div [formGroup]="myGroup">
<p>
    Date Reset
</p>
<p-calendar formControlName="date" selectionMode="range" [readonlyInput]="true"></p-calendar>
<button (click)="reset()">Reset</button>
<button (click)="setCustomDateRange()">Set Custom Date Range</button>

</div>

组件.ts

import { Component } from '@angular/core';
import { FormControl , FormGroup} from '@angular/forms';
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular';
  yearRange = '2000:2020';
  myGroup: any;
  rangeDates: Date[];
  constructor(){
    this.myGroup = new FormGroup({
    date: new FormControl('')
  });
  }
  setCustomDateRange(){
    var date = new Date();
    date.setDate(date.getDate() + 10);
    this.myGroup.get('date').setValue([new Date(), date]);
  }
  reset(){
    console.log(this.myGroup.get('date').value)
    this.myGroup.get('date').setValue(null);
  }


}

[Working code][1]

【讨论】：