我正在尝试重设primeng datepick压光机,但无法正常工作。我在angular 8中工作。我使用primem创建了自定义datepicker组件。我在下面提供了我的代码。如何重设?任何人都可以有想法吗?请帮助找到解决方案。
app.component.html:
<p-calendar dateformat="mm/dd/yyyy" [numberofmonths]="4" selectionmode="range" formControlName="datePick"></p-calendar>
<button (click)="resetdate()">Reset Date</button>
app.component.ts:
@ViewChild('p-calendar') calendar: any;
resetdate(){
this.calendar.value = null;
}
答案 0 :(得分:0)
使用[(ngModel)]
如下:
<p-calendar [(ngModel)]="value"></p-calendar>
,在ts中使用:
value: Date;
resetdate() {
this.value = null;
}
答案 1 :(得分:0)
您正在使用反应形式,在反应形式中,它将使用表单控件setValue方法进行设置。
更新:您可以将模型值作为数组提供。
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>
component.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);
}
}