A user must know in which conversation he/she is participating, so we need to display this information to the user. To do so, we are going to implement a thread listing component.
In order to display a list of threads, we are going to use a component for each thread to encapsulate all the information displayed to the user and functionalities. To create the desired component, follow these steps:
Create the component file, called
public/src/thread/thread.component.ts.Import the necessary dependencies:
import { Component, OnInit } from 'angular2/core'; import { RouterLink } from 'angular2/router'; import { ThreadService } from '../services/thread.service'; import { Thread } from '../datatypes/thread';Add the component annotation:
@Component({ inputs: ['thread'], selector: 'thread', directives: [ RouterLink ], template: ` <div class="thread-item"> <a href="#" [routerLink]="['./ThreadMessages', { identifier: thread._id }]"...