The QuizComponent also features some Edit and Delete buttons that we should definitely hide from the sight of any non-logged in user.

Again, we need to open the quiz.component.ts file and do what it takes to add the AuthService class to the loop:

[...]

import { AuthService } from '../../services/auth.service';

[...]

constructor(private activatedRoute: ActivatedRoute,
    private router: Router,
    private http: HttpClient,
    public auth: AuthService,
    @Inject('BASE_URL') private baseUrl: string) {

[...]

We then use it to conditionally hide the Edit and Delete buttons in the quiz.component.html template file:

[...]

<div *ngIf="auth.isLoggedIn()" class="edit">
    <input type="button" value="Edit"
            (click)="onEdit()"
            class="btn btn-sm btn-warning" />
    <input type="button" value="Delete"
            (click)="onDelete()"
            class="btn btn-sm btn-danger" />
</div>

[...]

That's basically it.

Again, we chose to make the auth instance member public instead of private, since we're also using it in the template file; that way, we can ensure that it will be found even in an AOT compilation scenario.