App HTML Component with ToDo List

app.component.html

<div class="container">
  <div class="row">
    <div class="col-12 jumbotron">
        <h1 class="display-4">Your ToDos</h1>    
    </div>    
    <div class="col-12" *ngIf="loading">
      Loading ToDos ...
    </div>
    <div class="col-12">
      <ul class="list-group list-group-flush">
          <li class="list-group-item" *ngFor="let todo of todos">
            {{todo.content}} 
            <span class="badge badge-primary pull-right" *ngIf="!todo.status">Pending</span>
            <span class="badge badge-success pull-right" *ngIf="todo.status">Completed</span>
          </li>
      </ul>
    </div>          
  </div>
</div>