2016-09-16 10 views
4

У меня есть приложение angular2, чей бэкэнд находится в java. У меня есть список клиентов. Когда я нажимаю, чтобы удалить клиента, клиент удаляется, но список не обновляется. Если я обновить страницу вручную, список обновится. Я попробовал маршрутизацию в компонент списка в методе добавления подписки, но это не работает.Angular2- Обновить UI после удаления

список-customers.component.html

<tr [class.warning]="customer.isDefault == 1" *ngFor="let customer of customers | orderBy:['firstName'] | search:searchCustomer.value;let serial = index"> 
       <td>{{ serial+1 }}</td> 
       <td>{{ customer?.firstName+' '+customer?.lastName}}</td> 
       <td>{{ customer.email}}</td> 
       <td>{{ customer.mobileNumber}}</td> 
       <td>{{ customer.streetAddress}}</td> 
       <td>{{ customer.priceList?.name}}</td> 
       <td><a [routerLink]="['/loggedIn','customer','edit', customer.id ]"><i class="fa fa-edit fa-2x"></i></a></td> 
       <td><a (click)="delete(customer)"><i class="fa fa-trash-o fa-2x"></i></a></td> 
       </tr> 

список-customers.component.ts

ngOnInit() 
    { 
     this.refreshCustomersList(); 
    } 

    delete(customer) 
    { 
     this.userService.delete(customer.id) 
      .subscribe(
       success=> 
       { 
        var index = this.customers.indexOf(customer, 0); 
        if (index > -1) 
        { 
         this.customers.splice(index, 1); 
        } 
       } 
      ) 

    } 

    refreshCustomersList() 
    { 
     this._authHttp.get(
       this.appService.getApiUrl() + "api/customer/list" 
      ) 
      .map(res=>res.json()) 
      .subscribe(
       successResponse=> 
       { 
        this.customers = successResponse.data.customers; 
       }, 
       () => console.log("Request Completed") 
      ) 

    } 
} 

ответ

6

Попробуйте вызвать this.refreshCustomersList(); в вашей delete функции, как это:

delete(customer) 
{ 
    this.userService.delete(customer.id) 
     .subscribe(
      success=> 
      { 
       var index = this.customers.indexOf(customer, 0); 
       if (index > -1) 
       { 
        this.customers.splice(index, 1); 
        this.refreshCustomersList(); 
       } 
      } 
     ) 

} 

Это приведет к обновлению массива customers после удаления клиента.

+0

Спасибо @ jhhoff02. Оно работало завораживающе. – usmanwalana

Смежные вопросы