TypeScript 2.x By Example

Board component – populating the data

Once we have the id, we can then use TrelloService to fetch all the boards and then filter the board based on the id, as shown in the following code:

 ngOnInit() { let boardId = this._route.snapshot.params['id']; console.log(boardId); this.board = this._trelloService.Boards.find(x=> x.id == boardId); }

You can see in the preceding code that we used TrelloService to fetch all the records and then just filtered to get the board for which the ID was passed. With this, we now have the selected board and its tasks and subtasks in our component.

One interesting thing to note here is how we used the same service in the Homepage component and in the board component to share the data. In the Homepage component, ...