CODEWITHSUNDEEP
angularprimeng
Alpha Bravo Charlie ...
Alpha Bravo Charlie ...

Reputation: 820

Calendar PrimeNG does not work

I have installed PrimeNG and want to use Calendar component of it. Thus, I have made a MyCalendar Component:

TS file:

import { Component } from '@angular/core';

@Component({
  selector: 'app-my-calendar',
  templateUrl: './my-calendar.component.html',
  styleUrls: ['./my-calendar.component.css']
})
export class CalendarDemoComponent  {    
    myDate1: Date;       
}

HTML file:

<div class="ui-g ui-fluid">
  <div class="ui-g-12 ui-md-4">
      <h3> A simple canedar </h3>
      <p-calendar [(ngModel)]="myDate1"></p-calendar> {{myDate1|date}} // line 4
  </div>
</div>

By running the app I get this error on the console:

CalendarDemoComponent.html:4 ERROR Error: No value accessor for form control with unspecified name attribute

Could you please help me finding out what is wrong in my code?

Upvotes: 1

Views: 3933

Answers (2)

Alpha Bravo Charlie ...
Alpha Bravo Charlie ...

Reputation: 820

The problem was the CalendarModule was missing tn the App Module. (I had imported it in MyCalendar module).

import {CalendarModule} from 'primeng/calendar';    

    imports: [
    BrowserModule,
    BrowserAnimationsModule,    
    CalendarModule
  ]

Upvotes: 1

Sajeetharan
Sajeetharan

Reputation: 222592

You should have the name attribute for your calendar,

<p-calendar [(ngModel)]="myDate1" name="date" dateFormat='dd/mm/yy'"></p-calendar>

Upvotes: 0

Related Questions