diff --git a/src/app/app.component.html b/src/app/app.component.html
index 5bd872a..f3b4310 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -5,6 +5,9 @@
Authentification
Appareils
+
+
Vous êtes connecté depuis {{ secondes }} secondes !
+
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 6576cce..846f9fd 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,15 +1,37 @@
-import {Component, OnInit} from '@angular/core';
+import { Component, OnInit, OnDestroy } from '@angular/core';
+import { Observable } from 'rxjs/Observable';
+import { Subscription } from 'rxjs/Subscription';
+import 'rxjs/add/observable/interval';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
-export class AppComponent implements OnInit {
+export class AppComponent implements OnInit, OnDestroy {
+
+ secondes: number;
+ counterSubscription: Subscription;
constructor() {
}
ngOnInit() {
+ const counter = Observable.interval(1000);
+ this.counterSubscription = counter.subscribe(
+ (value) => {
+ this.secondes = value;
+ },
+ (error) => {
+ console.log('Uh-oh, an error occurred! : ' + error);
+ },
+ () => {
+ console.log('Observable complete!');
+ }
+ );
+ }
+
+ ngOnDestroy() {
+ this.counterSubscription.unsubscribe();
}
}
diff --git a/src/app/appareil-view/appareil-view.component.ts b/src/app/appareil-view/appareil-view.component.ts
index 9c9867c..838fb50 100644
--- a/src/app/appareil-view/appareil-view.component.ts
+++ b/src/app/appareil-view/appareil-view.component.ts
@@ -1,15 +1,16 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, OnDestroy } from '@angular/core';
import { AppareilService } from '../services/appareil.service';
+import { Subscription } from 'rxjs/Subscription';
@Component({
selector: 'app-appareil-view',
templateUrl: './appareil-view.component.html',
styleUrls: ['./appareil-view.component.scss']
})
-export class AppareilViewComponent implements OnInit {
+export class AppareilViewComponent implements OnInit, OnDestroy {
- isAuth = false;
appareils: any[];
+ appareilSubscription: Subscription;
lastUpdate = new Promise((resolve, reject) => {
const date = new Date();
@@ -20,14 +21,15 @@ export class AppareilViewComponent implements OnInit {
);
});
- constructor(private appareilService: AppareilService) {
- setTimeout(() => {
- this.isAuth = true;
- }, 3000);
- }
+ constructor(private appareilService: AppareilService) { }
ngOnInit() {
- this.appareils = this.appareilService.appareils;
+ this.appareilSubscription = this.appareilService.appareilsSubject.subscribe(
+ (appareils: any[]) => {
+ this.appareils = appareils;
+ }
+ );
+ this.appareilService.emitAppareilSubject();
}
onAllumer() {
@@ -42,4 +44,7 @@ export class AppareilViewComponent implements OnInit {
}
}
+ ngOnDestroy() {
+ this.appareilSubscription.unsubscribe();
+ }
}
diff --git a/src/app/services/appareil.service.ts b/src/app/services/appareil.service.ts
index c1bf2ef..6f0918c 100644
--- a/src/app/services/appareil.service.ts
+++ b/src/app/services/appareil.service.ts
@@ -1,5 +1,10 @@
+import { Subject } from 'rxjs/Subject';
+
export class AppareilService {
- appareils = [
+
+ appareilsSubject = new Subject();
+
+ private appareils = [
{
id: 1,
name: 'Machine à laver',
@@ -17,6 +22,10 @@ export class AppareilService {
}
];
+ emitAppareilSubject() {
+ this.appareilsSubject.next(this.appareils.slice());
+ }
+
switchOnAll() {
for (let appareil of this.appareils) {
appareil.status = 'allumé';