Handle changing params to city component

anthonyoconnor · May 23, 2018 · d2e93bf · d2e93bf
1 parent 1bda146
commit d2e93bf
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 11 deletions.
diff --git a/src/app/app.component.html b/src/app/app.component.html
@@ -1 +1,12 @@
 <router-outlet></router-outlet>
+
+<p>Some test cities:</p>
+<div>
+    <a routerLink="/city/vancouver">Vancouver</a>
+</div>
+<div>
+    <a routerLink="/city/limerick">Limerick</a>
+</div>
+<div>
+    <a routerLink="/city/fakecity">Fake</a>
+</div>
diff --git a/src/app/city/city.component.ts b/src/app/city/city.component.ts
@@ -1,6 +1,6 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, OnChanges, SimpleChanges } from '@angular/core';
 import { WeatherService } from '../weather.service';
-import { ActivatedRoute } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 
 @Component({
   selector: 'app-city',
@@ -19,16 +19,24 @@ export class CityComponent implements OnInit {
   }
 
   ngOnInit() {
-    this.city = this.route.snapshot.params['city'];
 
-    this.weatherService.getCurrentWeather(this.city).subscribe(x => {
-      this.weather = x.weather.description;
-      this.temp = x.temp;
-    },
-      error => {
-        console.log('error occured', error);
-        this.failedToLoad = true;
-      });
+    this.route.paramMap.subscribe(route => {
+      this.city = route.get('city');
+      this.reset();
+      this.weatherService.getCurrentWeather(this.city).subscribe(x => {
+        this.weather = x.weather.description;
+        this.temp = x.temp;
+      },
+        error => {
+          console.log('error occured', error);
+          this.failedToLoad = true;
+        });
+    });
   }
 
+  reset() {
+    this.failedToLoad = false;
+    this.weather = '?';
+    this.temp = 0;
+  }
 }