Как реализовать сохранение перед выходом с помощью nz-tabset?

Question

Я использую zorro antd для реализации функции нескольких вкладок, я хотел бы предупредить моего пользователя, когда у него есть несохраненные изменения, и покинуть вкладку, только если пользователь подтвердит. Кажется, что нет обратного вызова перед тем, как покинуть вкладку, (nzSelectChange) - это обратный вызов после того, как вкладка изменилась, а не до. Так как же реализовать такую ​​функцию, используя nz-tabset of zorro?

Answer 1

NzTab имеет (nzClick) EventEmitter для обработки события щелчка заголовка вкладки, но он не генерирует собственное событие мыши, поэтому мы не можем захватить собственное событие. Но я обнаружил, что свойство nz-tab [nzTitle] может иметь значение TemplateRef, поэтому мы можем построить заголовок нашей вкладки и обработать событие click до запуска (nzSelectChange) набора вкладок. Например:

<ng-template #tabTitle1>
   <div (click)="beforeActivateTab(0, $event)">Tab 1</div>
</ng-template>

И я создаю онлайн-пример, который вы можете посетить здесь: https://stackblitz.com/edit/ng-zorro-antd-start-drc5uf