added auto-updating

had to disable ssr for it to work

Author: NCGThompson

angular.json

@@ -57,7 +57,9 @@
             "development": {
               "optimization": false,
               "extractLicenses": false,
-              "sourceMap": true
+              "sourceMap": true,
+              "ssr": false,
+              "prerender": false
             }
           },
           "defaultConfiguration": "production"

src/app/components/home/home.component.ts

@@ -2,6 +2,7 @@ import { HttpClient, HttpClientModule } from '@angular/common/http';
 import { Component, OnInit } from '@angular/core';
 import { DataService } from '../../services/data.service';
 import { KeyValuePipe } from '@angular/common';
+import { Subscription, interval, switchMap } from 'rxjs';
 
 @Component({
   selector: 'app-home',
@@ -12,6 +13,7 @@ import { KeyValuePipe } from '@angular/common';
   styleUrl: './home.component.css'
 })
 export class HomeComponent implements OnInit {
+  private intervalSub!: Subscription;
 
   showData: any
   devices: any
@@ -27,20 +29,19 @@ export class HomeComponent implements OnInit {
 
   }
   ngOnInit(): void {
-    this.getCurrent()
-
+    this.intervalSub = interval(1000).pipe(
+      switchMap(() => this.dataService.getCurrentData())
+    ).subscribe(res => {
+      if (res) this.applyData(res);
+    });
   }
 
-  getCurrent() {
-    this.dataService.getCurrentData().subscribe((res: any) => {
-      this.showData = res.MTConnectStreams
-      this.devices = this.showData.Streams
-      console.log(this.devices)
-
-    }, (error) => {
-      console.log(error)
-    })
+  applyData(res: any) {
+    this.showData = res.MTConnectStreams
+    this.devices = this.showData.Streams
+    console.log(this.devices)
   }
+
   openDeviceComponent(item: any, x: any) {
     console.log('x', x)
     this.selectedComponentEventsIterate = [];

src/app/components/sample/sample.component.ts

@@ -2,6 +2,7 @@ import { HttpClient, HttpClientModule } from '@angular/common/http';
 import { Component, OnInit } from '@angular/core';
 import { DataService } from '../../services/data.service';
 import { KeyValuePipe } from '@angular/common';
+import { Subscription, interval, switchMap } from 'rxjs';
 
 @Component({
   selector: 'app-sample',
@@ -12,6 +13,8 @@ import { KeyValuePipe } from '@angular/common';
   styleUrl: './sample.component.css'
 })
 export class SampleComponent implements OnInit {
+  private intervalSub!: Subscription;
+
   showData: any
   devices: any
   selectedComponentName: any
@@ -26,20 +29,19 @@ export class SampleComponent implements OnInit {
 
   }
   ngOnInit(): void {
-    this.getCurrent()
-
+    this.intervalSub = interval(1000).pipe(
+      switchMap(() => this.dataService.getCurrentData())
+    ).subscribe(res => {
+      if (res) this.applyData(res);
+    });
   }
 
-  getCurrent() {
-    this.dataService.getSampleData().subscribe((res: any) => {
-      this.showData = res.MTConnectStreams
-      this.devices = this.showData.Streams
-      console.log(this.devices)
-
-    }, (error) => {
-      console.log(error)
-    })
+  applyData(res: any) {
+    this.showData = res.MTConnectStreams
+    this.devices = this.showData.Streams
+    console.log(this.devices)
   }
+  
   openDeviceComponent(item: any, x: any) {
     console.log('x', x)
     this.selectedComponentEventsIterate = [];

src/app/components/setting/setting.component.ts

@@ -2,6 +2,8 @@ import { HttpClient, HttpClientModule } from '@angular/common/http';
 import { Component, OnInit } from '@angular/core';
 import { DataService } from '../../services/data.service';
 import { KeyValuePipe } from '@angular/common';
+import { Subscription, interval, switchMap } from 'rxjs';
+
 @Component({
   selector: 'app-setting',
   standalone: true,
@@ -11,6 +13,8 @@ import { KeyValuePipe } from '@angular/common';
   styleUrl: './setting.component.css'
 })
 export class SettingComponent implements OnInit {
+  private intervalSub!: Subscription;
+
   showData: any
   devices: any
   selectedComponentName: any
@@ -25,20 +29,19 @@ export class SettingComponent implements OnInit {
 
   }
   ngOnInit(): void {
-    this.getCurrent()
-
+    this.intervalSub = interval(1000).pipe(
+      switchMap(() => this.dataService.getCurrentData())
+    ).subscribe(res => {
+      if (res) this.applyData(res);
+    });
   }
 
-  getCurrent() {
-    this.dataService.getCountData().subscribe((res: any) => {
-      this.showData = res.MTConnectStreams
-      this.devices = this.showData.Streams
-      console.log(this.devices)
-
-    }, (error) => {
-      console.log(error)
-    })
+  applyData(res: any) {
+    this.showData = res.MTConnectStreams
+    this.devices = this.showData.Streams
+    console.log(this.devices)
   }
+  
   openDeviceComponent(item: any, x: any) {
     console.log('x', x)
     this.selectedComponentEventsIterate = [];