Как использовать поведенияSubject при удалении элемента из массива - PullRequest
Новая
       6

Как использовать поведенияSubject при удалении элемента из массива

0 голосов
/ 18 апреля 2020

У меня angular 8 заявка.

И у меня есть два компонента, например, дочерние и родительские отношения. Поэтому я удаляю элемент из дочернего элемента, но затем элемент все еще отображается в родительском элементе (список элементов). Только после обновления страницы sh элемент исчез из списка.

Итак, у меня есть этот сервис: 

export class ItemListService {
 _updateItemChanged = new Subject<any>();
 _removeItemChanged = new BehaviorSubject<any>([]);

  constructor() {}
}

и это item.ts - child: 

openRemoveDialog() {
    const dialogRef = this.dialog.open(ItemRemoveDialogComponent, {
      width: '500px',
      height: '500px',
      data: {
        dossierId: this.dossier.id,
        item: this.item,
        attachments: this.item.attachments
      }
    });

    this.itemListService._removeItemChanged.next(this.item.title);

    dialogRef.afterClosed().subscribe(result => {
      if (result === true) {
        this.router.navigate(['/dossier', this.dossier.id]);

      }
    });
  }

и это view.ts (список элементов) - родитель: так что в этом компоненте должно быть сделано refre sh 



 ngOnInit(): void {
    this.show = !this.router.url.includes('/item/');

    this.itemlistService._updateItemChanged.subscribe(data => {
      const index = this.dossierItems.findIndex(a => a.id === data.id);
      this.dossierItems[index] = data;
    });

    this.itemlistService._removeItemChanged.subscribe(data => {
     // this.dossierItems.pop(); What I have to fill in here?

    });

Так что мне нужно изменить?

Спасибо

, и это функция удаления: 

  remove() {
    this.dossierItemService.deleteDossierItem(this.data.dossierId, this.data.item.id)
      .subscribe(() => {
        this.dialogRef.close(true);
      }, (error) => {
        const processedErrors = this.errorProcessor.process(error);
        this.globalErrors = processedErrors.getGlobalValidationErrors();
    });
  }

У меня теперь это так: 

remove() {
    this.dossierItemService.deleteDossierItem(this.data.dossierId, this.data.item.id)
      .subscribe(() => {
        this.dialogRef.close(true);
        this.itemListService._removeItemChanged.next(true);
      }, (error) => {
        const processedErrors = this.errorProcessor.process(error);
        this.globalErrors = processedErrors.getGlobalValidationErrors();
    });
  }

и в представлении .ts, как ths: 

 ngOnInit(): void {
  this.itemlistService._removeItemChanged.subscribe(update => update === true ? this.dossierItems : '');
}

, но все равно список не будет обновляться

1 Ответ

1 голос
/ 18 апреля 2020

Вам нужно создать новую ссылку на ваш массив для Angular, чтобы обновить экран следующим образом 

this.itemlistService._removeItemChanged.subscribe(data => { 
    // this.dossierItems.pop(); What I have to fill in here?
    this.dossierItems = this.dossierItems.filter(e => e.title !== data);
});
...