diet-web-ui/projects/client/src/app/pages/data-vis/data-vis.component.ts

import { Component } from "@angular/core";
import { ApiService } from "@cdk/services";
import { format } from "date-fns";
import { Subject, interval, takeUntil } from "rxjs";

@Component({
	selector: "app-data-vis",
	templateUrl: "./data-vis.component.html",
	styleUrls: ["./data-vis.component.less"],
})
export class DataVisComponent {
	constructor(private api: ApiService) {}
	destroy$ = new Subject();

	showTime: string = "";

	ngOnInit(): void {
		interval(1000)
			.pipe(takeUntil(this.destroy$))
			.subscribe(() => {
				this.showTime = format(new Date(), "yyyy-MM-dd HH:mm:ss");
			});

		this.api.getMenuDataVis().subscribe((res) => {
			console.log("res", res);
		});
	}

	ngOnDestroy(): void {
		this.destroy$.next(null);
		this.destroy$.complete();
	}
}