diff --git a/src/app/app.component.html b/src/app/app.component.html
index c220c79..474e8aa 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -4,13 +4,17 @@
Mes appareils
Mis à jour le : {{ lastUpdate | async | date: 'd MMMM y' | uppercase }}
-
+ [appareilStatus]="appareil.status"
+ [index]="i">
+
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 7e526d6..846136d 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,11 +1,12 @@
-import { Component } from '@angular/core';
+import {Component, OnInit} from '@angular/core';
+import { AppareilService } from './services/appareil.service';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
-export class AppComponent {
+export class AppComponent implements OnInit {
isAuth = false;
lastUpdate = new Promise((resolve, reject) => {
@@ -16,22 +17,9 @@ export class AppComponent {
}, 2000
);
});
- appareils = [
- {
- name: 'Machine à laver',
- status: 'éteint'
- },
- {
- name: 'Frigo',
- status: 'allumé'
- },
- {
- name: 'Ordinateur',
- status: 'éteint'
- }
- ];
+ appareils: any[];
- constructor() {
+ constructor(private appareilService: AppareilService) {
setTimeout(
() => {
this.isAuth = true;
@@ -39,7 +27,19 @@ export class AppComponent {
);
}
+ ngOnInit() {
+ this.appareils = this.appareilService.appareils;
+ }
+
onAllumer() {
- console.log('On allume tout !');
+ this.appareilService.switchOnAll();
+ }
+
+ onEteindre() {
+ if (confirm('Etes-vous sûr de vouloir éteindre tous vos appareils ?')) {
+ this.appareilService.switchOffAll();
+ } else {
+ return null;
+ }
}
}
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 73e91b5..c9d2ca3 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -3,6 +3,7 @@ import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { AppareilComponent } from './appareil/appareil.component';
import { FormsModule } from '@angular/forms';
+import { AppareilService } from './services/appareil.service';
@NgModule({
declarations: [
@@ -13,7 +14,9 @@ import { FormsModule } from '@angular/forms';
BrowserModule,
FormsModule
],
- providers: [],
+ providers: [
+ AppareilService
+ ],
bootstrap: [AppComponent]
})
export class AppModule { }
diff --git a/src/app/appareil/appareil.component.html b/src/app/appareil/appareil.component.html
index a604126..de0a6c0 100644
--- a/src/app/appareil/appareil.component.html
+++ b/src/app/appareil/appareil.component.html
@@ -1,8 +1,15 @@
-
+
Appareil : {{ appareilName }} -- Statut : {{ appareilStatus }}
+
+
+
+
diff --git a/src/app/appareil/appareil.component.ts b/src/app/appareil/appareil.component.ts
index 51b7a8f..75e5745 100644
--- a/src/app/appareil/appareil.component.ts
+++ b/src/app/appareil/appareil.component.ts
@@ -1,4 +1,5 @@
import { Component, Input, OnInit } from '@angular/core';
+import { AppareilService } from '../services/appareil.service';
@Component({
selector: 'app-appareil',
@@ -10,8 +11,10 @@ export class AppareilComponent implements OnInit {
@Input() appareilName: string;
@Input() appareilStatus: string;
+ @Input() index: number;
- constructor() { }
+ constructor(private appareilService: AppareilService) {
+ }
ngOnInit() {
}
@@ -23,4 +26,12 @@ export class AppareilComponent implements OnInit {
return 'red';
}
}
+
+ onSwitch() {
+ if (this.appareilStatus === 'allumé') {
+ this.appareilService.switchOffOne(this.index);
+ } else if (this.appareilStatus === 'éteint') {
+ this.appareilService.switchOnOne(this.index);
+ }
+ }
}
diff --git a/src/app/services/appareil.service.ts b/src/app/services/appareil.service.ts
new file mode 100644
index 0000000..a75f8c7
--- /dev/null
+++ b/src/app/services/appareil.service.ts
@@ -0,0 +1,36 @@
+export class AppareilService {
+ appareils = [
+ {
+ name: 'Machine à laver',
+ status: 'éteint'
+ },
+ {
+ name: 'Frigo',
+ status: 'allumé'
+ },
+ {
+ name: 'Ordinateur',
+ status: 'éteint'
+ }
+ ];
+
+ switchOnAll() {
+ for (let appareil of this.appareils) {
+ appareil.status = 'allumé';
+ }
+ }
+
+ switchOffAll() {
+ for (let appareil of this.appareils) {
+ appareil.status = 'éteint';
+ }
+ }
+
+ switchOnOne(i: number) {
+ this.appareils[i].status = 'allumé';
+ }
+
+ switchOffOne(i: number) {
+ this.appareils[i].status = 'éteint';
+ }
+}