In this section, we're going to implement some filter functionality for our task list. In order to control the active filter criteria, we are first building a toggle button list component. Let's go ahead and create a new component using the Angular CLI:

ng generate component --spec false -ve none ui/toggle

After running the Angular CLI generator command on your console, let's edit the HTML template of the newly created component in src/app/ui/toggle/toggle.component.html:

<button class="toggle-button" 
        *ngFor="let button of buttonList" 
        [class.active]="button === activeButton" 
        (click)="activate(button)">{{button}}</button> 

Nothing special here, really! We repeat a button by iterating over an instance field called buttonList using the NgFor directive. This button list will...