I'm working on a app which I should set messages according to current time based on hours.
For ex if time is: 23:35:2 I should set a string to Good night <user name> and if the time goes 4:00:0 I want to set Good morning <user name> accordingly.
Currently I'm writing the logic in angular service's BehaviourSubject. I get the current time by using javascript. But after I console logged the value the time is statically there.
let currentDate = new Date();
let time = currentDate.getHours() + ":" + currentDate.getMinutes() + ":" + currentDate.getSeconds();
console.log(time);So I have set a BehaviourSubject and tried getting the time dynamically but the value is still static.
Below is my service file code
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class AppService {
private time: BehaviorSubject<string>;
constructor(private http:HttpClient) { }
getDate() {
let currentDate = new Date();
let time = currentDate.getHours() + ":" + currentDate.getMinutes() + ":" + currentDate.getSeconds();
console.log(time);
return this.time.next(JSON.stringify(time));
}
}
and tried calling it in my home file like this.
ngOnInit() {
return this.appService.getDate();
}
I'm getting error ERROR Error: Uncaught (in promise): TypeError: Cannot read properties of undefined (reading 'next')
I'm barely new to angular bear with me. I'll appreciate any help.
In service
date = new Date();
getDate() {
return interval(1000).pipe(map(_ => this.getDateTime()));
}
// get new time by adding + sec
private getDateTime() {
this.date.setSeconds(this.date.getSeconds() + 1);
return (
this.date.getHours() +
':' +
this.date.getMinutes() +
':' +
this.date.getSeconds()
);
}
In your component :
time$: Observable<any>;
constructor(private appService: AppService) {
this.time$ = this.appService.getDate();
}
In template
Time {{ this.time$ | async }}
If you want to increase delay time to the interval ex. for every 5 sec just change interval(5000) parameter as well as here this.date.setSeconds(this.date.getSeconds() + 5);