As a newcomer to Angular 2/4 coming from Java, I have some uncertainties regarding an Angular project utilizing PrimeNG components.
To kick things off, I followed an introductory video tutorial for setting up my first Angular 4 webapp with PrimeNG integration: https://www.youtube.com/watch?v=6Nvze0dhzkE
The example provided in the tutorial involves incorporating a PrimeNG calendar component as seen below:
<p-calendar [(ngModel)]="value"></p-calendar>
{{value | date:'dd.mm.yyyy'}}
In relation to this, I am slightly confused about the logic behind this implementation and how it could be refactored. It appears that the custom tags correspond to components, but please correct me if I am mistaken.
I assume the necessary PrimeNG code is located within the node_modules directory of my project, right?
Furthermore, modifications were made to the app.module.ts file:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import {CalendarModule} from 'primeng/primeng';
import {FormsModule} from '@angular/forms';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserAnimationsModule,
BrowserModule,
FormsModule,
CalendarModule,
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
// ???
export class MyModel {
value: Date;
}
My main confusion lies within the declaration of the MyModel class in the app.module.ts file:
export class MyModel { value: Date; }
It seems redundant as removing it did not affect the functionality of the project. So, what purpose does this line serve in my view?
<p-calendar [(ngModel)]="value"></p-calendar>
Initially, I assumed it would store user-input values into the 'value' field of the MyModel class, but it doesn't seem to work as expected. What am I overlooking here?
Additionally, is it possible to create a custom component like 'MyCustomCalendar' to use in my app.component.html view, associated with a <customtag> tag, containing...
...the specified content.
...a variable initialized with the selected date.
Is such customization feasible in Angular projects?