Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to use PrimeNG calendar with yearNavigator (doesn't work)

I wanted to use the primeng calendar with month and year selector. I copy-paste the code example from their site, but I don't see the year selector. My Dependencies:

"primeicons": "^1.0.0", "primeng": "^6.1.2",

<p-calendar view="month" dateFormat="mm/yy"
    [yearNavigator]="true" yearRange="2000:2030">
</p-calendar>

I can see only the months.

any ideas?

like image 260
tal faran Avatar asked Mar 04 '23 04:03

tal faran


1 Answers

try to give it a ngModel then it will be shown correctly: ts:

public value;
constructor() {   
  this.value = new Date();
}

html:

<p-calendar [(ngModel)]="value" view="month" dateFormat="mm/yy" [yearNavigator]="true" yearRange="2000:2030"></p-calendar>

DEMO.

like image 136
Fateme Fazli Avatar answered Mar 15 '23 18:03

Fateme Fazli