2

打开对话框时,会多次显示

试图通过检查对话框是否已打开来防止双重打开

if (!this.dialogService.hasOpenDialog) {
  return this.dialogService
    .open({ viewModel: AssignTeam })
    .whenClosed((response) => {
      if (!response.wasCancelled) {
        return this.protectionService.assignTeam(devices, response.output);
      }

      this.selectedDevices.splice(0);
    });
}

预期:应显示一个对话框。当用户单击确定时,它应该消失实际:对话框多次打开。当用户单击确定时,他会看到相同的对话框并且必须取消它

这是打开对话框时的html:

<body class="ux-dialog-open">
    <ux-dialog-overlay style="z-index: 1000;" class="active"></ux-dialog-overlay>
    <ux-dialog-container style="z-index: 1000;" class="active">
        <div style="margin-top: 84.5px; margin-bottom: 84.5px;">
            <div>
                <div class="popup">
                    <div class="black-bg1">
                        <ai-dialog class="modalpopup-container padd35 dis-block">
                            <ai-dialog-header>
                                <!-- omitted --> 
                            </ai-dialog-header>
                            <ai-dialog-body>
                                <!-- ommited-->
                            </ai-dialog-body>
                            <ai-dialog-footer class="text-center">
                                <!-- ommitted-->
                            </ai-dialog-footer>
                        </ai-dialog>
                    </div>
                </div>
            </div>
        </div>
    </ux-dialog-container>
    <ux-dialog-overlay style="z-index: 1000;" class="active"></ux-dialog-overlay>
    <ux-dialog-container style="z-index: 1000;" class="active">
        <div style="margin-top: 84.5px; margin-bottom: 84.5px;">
            <div>
                <div class="popup">
                    <div class="black-bg1">
                        <ai-dialog class="modalpopup-container padd35 dis-block">
                            <ai-dialog-header>
                                <!-- omitted-->
                            </ai-dialog-header>
                            <ai-dialog-body>
                               <!-- omitted-->
                            </ai-dialog-body>
                            <ai-dialog-footer class="text-center">
                                <!-- omitted-->
                            </ai-dialog-footer>
                        </ai-dialog>
                    </div>
                </div>
            </div>
        </div>
    </ux-dialog-container>
    <script id="__bs_script__">
        //<![CDATA[
        document.write("<script async src='/browser-sync/browser-sync-client.js?v=2.26.3'><\/script>".replace("HOST",
            location.hostname));
        //]]>
    </script>
    <script async="" src="/browser-sync/browser-sync-client.js?v=2.26.3"></script>
    <div aurelia-app="main" class="page_container">
        <!-- omitted-->
    </div>
    <script src="scripts/vendor-bundle.js"></script>
    <script>
        requirejs.config({
            skipDataMain: true
        });
        // Configure Bluebird Promises.
        Promise.config({
            longStackTraces: false,
            warnings: false,
            cancellation: true
        });
        require(['aurelia-bootstrapper']);
    </script>
    <div></div>
    <div></div>
</body>

还尝试使用以下代码进行更多调查:

if (!this.dialogService.hasActiveDialog) {
  console.log(this.dialogService);

  return this.dialogService
    .open({ viewModel: AssignTeam })
    .then((openDialogResult: DialogOpenResult) => {
      console.log(openDialogResult);
      return openDialogResult.closeResult;
    });

对话服务调试

似乎分配了两个控制器

4

0 回答 0