Set blank value in primeng pcalendar

Question

I have a problem with a p-calendar in a priming theme and Angular 2, I want to clean the calendar value after the user selects a date and set a blank value. My code:

Component

<div style="margin-right: -6px"> 
     <p-calendar [(ngModel)]="viewModel.fromDate" [showIcon]="true" readOnlyInputText="true" (click)="restoreValues()"></p-calendar>
</div>

TypeScript file

export class RequestSearcherComponent implements OnInit {


restoreValues(): void {

    this.viewModel.areaIds = [];
    this.viewModel.cedingIds = [];
    this.viewModel.requestType = [];
    this.viewModel.requestResponsible = [];
    this.viewModel.requestStatus = [];
    this.fromDate.setDate(null);
   }
}

I tried a lot of methods and ways as the setDate that appears in the code. But doesn't works :(

Can anybody help me?

Thanks in advance.

Answer 1

Solved!

Is not the best way but works...

Component

<div>     
     <p-calendar #fromCal [(ngModel)]="value" [showIcon]="true" readOnlyInputText="true"></p-calendar>
</div>   

TypeScript file

@Component({
selector: 'app-request-searcher',
templateUrl: './request-searcher.component.html'
})

export class RequestSearcherComponent implements OnInit {

@ViewChild('fromCal') calendarFrom: Calendar;

/** My awesome code... */

restoreValues(): void {

    this.calendarFrom.value = null;
    this.calendarFrom.updateInputfield();

   }
}