Как обновить список в angular 6?

Question

Мой список не обновляется.Когда я нажимаю на img, мой selectedStudent.products.list не обновляется.мой код, как показано ниже: -

    <div class="row">
      <div class="col-sm-3">
        <div *ngFor="let p6 of selectedStudent.products.list">
          <div *ngIf="p6.productName === 'FLIP BOOK'; then ifcondition"></div>
          <ng-template #ifcondition>
            <p>Hi Arjun this is school Id {{selectedStudent.schoolId}}</p>
            <a class="block" data-toggle="modal" data-target="#flipbookmodal">
              <img alt="" class="img-responsive" src="//res.cloudinary.com/klassaktcontent/image/upload/v1536062876/book-service.jpg">
            </a>
          </ng-template>
        </div>
      </div>
    </div>

я использую этот код

export class KlassaktProductsComponent extends KlassaktDashboardComponent implements OnInit {
  protected async onVisible() { 
    if (this.account && this.selectedStudent && this.selectedStudent.products == undefined) {
      let isSibling = this.selectedStudent.isSibling == 1 ? 1 : 0;
      this.selectedStudent.products = await this._apiService.post <listData<any>>('api/getProductDetails', { schoolID: this.selectedStudent.schoolId, isSibling: isSibling});      
    }
  }