Adjust logic to show respective content list items only now

src/app/content-list/content-list.component.ts

 import { Component, OnInit } from '@angular/core';
 import { ContentService } from '../content.service';
 import { Content } from '../content';
+import { ActivatedRoute } from '@angular/router';
+import { RoomService } from '../room.service';
 
 @Component({
   selector: 'app-content-list',
@@ -10,14 +12,27 @@ import { Content } from '../content';
 export class ContentListComponent implements OnInit {
   contents: Content[];
 
-  constructor(private contentService: ContentService) { }
+  constructor(
+    private contentService: ContentService,
+    private route: ActivatedRoute,
+    private roomService: RoomService,
+  ) { }
 
   ngOnInit() {
-    this.getContents();
+    this.route.params.subscribe(params => {
+      this.getRoom(params['roomId']);
+    });
+  }
+
+  getRoom(id: string): void {
+    this.roomService.getRoom(id).subscribe(
+      params => {
+        this.getContents(params['id']);
+      });
   }
 
-  getContents(): void {
-    this.contentService.getContents()
+  getContents(roomId: string): void {
+    this.contentService.getContents(roomId)
     .subscribe(contents => {
       this.contents = contents;
     });

src/app/content.service.ts

@@ -16,8 +16,9 @@ export class ContentService extends ErrorHandlingService {
     super();
   }
 
-  getContents(): Observable<Content[]> {
-    return this.http.get<Content[]>(this.contentUrl).pipe(
+  getContents(roomId: string): Observable<Content[]> {
+    const url = `${this.contentUrl}/?roomId=${roomId}`;
+    return this.http.get<Content[]>(url).pipe(
       catchError(this.handleError('getContents', []))
     );
   }