PrimeNg TabView с ConfirmDialog

Я безуспешно пытаюсь использовать компонент PrimeNg TabView вместе с confirmDialog, вот мой код:

<p-tabView (onChange)="onTabChange($event)" [(activeIndex)]="index">...</p-tabView> 


  onTabChange(event){
    this.confirmationService.confirm({
      message: 'Do you confirm ?',
      accept:  () => {
      this.index = event.index;
      },
      reject:() =>{        }
      });
   }

У вас есть идея, как предотвратить или разрешить изменение вкладки с помощью диалогового окна подтверждения?

Спасибо


typescript javascript angular tabview primeng
person Zakariaa.B    schedule 29.01.2019    source источник

Ответы (1)


arrow_upward
4
arrow_downward

На основе аналогичного решения для вкладок материального дизайна, здесь это решение моей проблемы:

  1. в html Объявите локальную переменную, ссылающуюся на объект DOM TabView:

    <p-tabView #onglets>...</p-tabView>

  2. в component.ts измените функцию по умолчанию, вызываемую при нажатии на вкладку с определенной функцией, в соответствии с вашим случаем:

    @ViewChild('onglets') onglets: TabView; this.onglets.open = this.interceptOngletChange.bind(this); ... interceptOngletChange(event: Event, tab: TabPanel){ const result = confirm(Вы действительно хотите выйти из вкладки? ); return result && TabView.prototype.open.apply(this.onglets, argumentsList); }); }

person Zakariaa.B    schedule 30.01.2019
comment
что это за список аргументов? - person manjeet lama; 26.06.2020
comment
любые аргументы, которые вам нужно передать - person Zakariaa.B; 26.06.2020
comment
Отлично. Большое спасибо. - person Dheeraj Kumar; 16.07.2021