If this design is considered terrible, I am more than willing to make changes.
Within my index.html, in the body section, I have:
<month [year]="2016" [monthOfYear]="4">Loading...</month>
The contents of month.component.ts are as follows:
import { Component, Input, OnInit } from '@angular/core';
import { DayComponent } from '../day/day.component';
import * as Models from '../../../models/_models';
@Component({
selector: 'month',
moduleId: module.id,
templateUrl: 'month.component.html',
styleUrls: ['month.component.css'],
directives: [DayComponent]
})
export class MonthComponent {
name: string;
days: Models.Day[];
@Input('year') year: number;
@Input('monthOfYear') monthOfYear: number;
month: Models.Month;
ngOnInit() {
this.month = new Models.Month(this.year, this.monthOfYear);
this.name = this.month.getMonthName();
this.days = this.month.days;
}
}
Despite ngOnInit() being called correctly, both year and monthOfYear are found to be undefined at that point. How can I ensure that the values are passed in during ngOnInit(), or is there a better approach to achieve this?