I recently embarked on the journey of learning Angular 4 and TypeScript, but I've encountered my first obstacle.
My current challenge involves creating a simple date and time component. Despite having a seemingly correct Javascript code, I believe I may not be handling the scope according to Angular's requirements, resulting in an error message that reads:
Failed to compile very/long/file/path/date-time.component.ts (35,18): Property 'date' does not exist on type 'DateTimeComponent'.
It appears that my methods might not be placed correctly or perhaps I need to declare my properties outside of setTime()
. Any guidance or suggestions would be highly appreciated.
date-time.component.ts:
export class DateTimeComponent implements OnInit {
constructor() {
}
ngOnInit() {
this.setTime();
}
checkTime(i) {
return (i < 10) ? "0" + i : i;
}
setTime() {
let month = ["January", "February",
"March", "April",
"May", "June",
"July", "August",
"September", "October",
"November", "December"];
//date
let date: Date = new Date(); // this only accessible within setTime() method
let d: any = date.getDate();
let m: any = date.getMonth();
let y: any = date.getFullYear();
//time
let h: any = date.getHours();
let min: any = date.getMinutes();
let s: any = date.getSeconds();
let newMin: any = this.checkTime(this.min);
let newS: any = this.checkTime(this.s);
let myDate: any = d + " " + month[this.m] + " " + y;
let myTime: any = h + ":" + newMin + ":" + newS;
let t: any = setTimeout(() => {
startTime()
}, 500);
}
} //end of class
date-time.component.html:
<div ng-controller='TimeCtrl'>
<p>{{ myDate }}</p>
<p>{{ myTime }}</p>
</div>