离开 TabStrip 中的选项卡时显示模态对话框

Question

有没有办法在用户选择TabStrip 组件中的选项卡时显示模态对话框？下面的代码显示 window.confirm，无法显示模态对话框。

onTabSelected(e : any){
    if (!window.confirm("Continue with navigation?")) {
        e.prevented = true;
    }  
}

Answer 1

最终取消选项卡选择事件，显示模态对话框，并根据用户回答重新提交事件。

Answer 2

该对话框不能直接替代 window.confirm，因为它不能阻塞 UI 线程。要将 window.confirm 替换为 Kendo UI 对话框，您可以阻止所有选项卡选择，并等待对话框结果：

onTabSelected(e: any) {
    e.prevented = true;
    this.dialogService.open({
      content: "Continue with navigation?",
      actions: [
        { text: "No" },
        { text: "Yes", primary: true }
      ]
    }).result.subscribe((result) => {
        if (result.primary) {
            // change tab through code
            this.tabStrip.selectTab(e.index);
        }
    });
}

有关工作演示，请参阅 this plunkr。

离开 TabStrip 中的选项卡时显示模态对话框

Showing modal dialog when navigating away from a tab in TabStrip

kendo-ui-angular2