Step 10.11: Subscribe to the party publication

client/imports/app/parties/party-details.component.ts

@@ -1,7 +1,8 @@
 import { Component, OnInit, OnDestroy } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { Subscription } from 'rxjs/Subscription';
-import { Meteor } from 'meteor/meteor'; 
+import { Meteor } from 'meteor/meteor';
+import { MeteorObservable } from 'meteor-rxjs';
 
 import 'rxjs/add/operator/map';
 
@@ -18,6 +19,7 @@ export class PartyDetailsComponent implements OnInit, OnDestroy {
   partyId: string;
   paramsSub: Subscription;
   party: Party;
+  partySub: Subscription;
 
   constructor(
     private route: ActivatedRoute
@@ -27,9 +29,15 @@ export class PartyDetailsComponent implements OnInit, OnDestroy {
     this.paramsSub = this.route.params
       .map(params => params['partyId'])
       .subscribe(partyId => {
-        this.partyId = partyId
+        this.partyId = partyId;
 
-        this.party = Parties.findOne(this.partyId);
+        if (this.partySub) {
+          this.partySub.unsubscribe();
+        }
+
+        this.partySub = MeteorObservable.subscribe('party', this.partyId).subscribe(() => {
+          this.party = Parties.findOne(this.partyId);
+        });
       });
   }
 
@@ -50,5 +58,6 @@ export class PartyDetailsComponent implements OnInit, OnDestroy {
 
   ngOnDestroy() {
     this.paramsSub.unsubscribe();
+    this.partySub.unsubscribe();
   }
 }