Aurelia Dialogはダイアログが返る前に 'then'を実行します

Question

確認ダイアログを表示するビューを持っていますが、ダイアログが結果を返すのを待つ代わりに、コードは約束の 'then'部分にまっすぐジャンプします。以下のコードを参照してください：それは動作しますので、私は、ビューのHTMLを省略している

ConfirmDialog.ts

import { inject } from 'aurelia-framework'; 
import { DialogController } from 'aurelia-dialog'; 

@inject(DialogController) 
export class ConfirmDialog { 
    private message: string; 
    private controller: DialogController; 

    constructor(controller: DialogController) { 
    this.controller = controller; 
    } 

    public activate(message: string) { 
    this.message = message; 
    } 
} 

ConfirmDialog.html

<template> 
    <div tabindex="-1" role="dialog"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" click.trigger="controller.cancel()" class="close" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
      <h4 class="modal-title">Confirmation</h4> 
     </div> 
     <div class="modal-body"> 
      ${message}? 
     </div> 
     <div class="modal-footer"> 
      <button type="button" class="btn btn-default" click.trigger="controller.cancel()">No!</button> 
      <button type="button" class="btn btn-danger" click.trigger="controller.ok()">Yes</button> 
     </div> 
     </div><!-- /.modal-content --> 
    </div><!-- /.modal-dialog --> 
    </div><!-- /.modal --> 
</template> 

SomeView.ts

import * as moment from 'moment'; 
import { inject, singleton } from 'aurelia-framework'; 
import { DialogService } from 'aurelia-dialog'; 
import { ConfirmDialog } from '../components/modal/confirmDialog'; 
import { InfoDialog } from '../components/modal/infoDialog'; 
import { StateStore } from '../common/StateStore'; 
import { Routing } from '../common/routing'; 

@singleton() 
@inject(Routing, StateStore, DialogService) 
export class SomeView { 
    private routing: Routing; 
    private commonState: StateStore; 
    private dialogService: DialogService; 

    constructor(routing: Routing, stateStore: StateStore, dialogService: DialogService) { 
     this.routing = routing; 
     this.commonState = stateStore; 
     this.dialogService = dialogService; 
    } 

    public someButtonClickHandler(someArg: SomeType) { 
     if (!this.routing.auth.authenticated) { 
     this.routing.router.navigate('#/login'); 
     } 
     this.dialogService.open({ 
     viewModel: ConfirmDialog, 
     model: 
      'Do you wish to continue' 
     }).then((response) => { 
     if (response.wasCancelled) { 
      return; 
     } 

     this.dialogService.open({ 
      viewModel: InfoDialog, 
      model: 'Why is this happening..' 
     }); 
     }); 
    } 
} 

をし、すべてのバインディングが正しく起動しています。これはうまくいきましたが、ランタイムエラーの原因となったaurelia-bundlerを更新しましたので、以前のバージョンのバンドルに戻りました。ランタイムエラーが停止しましたが、Promiseが短絡しているようです。私もバージョン管理からプロジェクトをチェックしようとしたが、これは起こっている。何か問題があった場合にブラウザのキャッシュをクリアしようとしましたが、私が何をしているにせよ、確認ダイアログで何らかのやりとりが起こる前に、「どうしてですか？ InfoDialogで「OK」をクリックすると、確認ダイアログがその下にあり、キャンセルまたはOKをクリックすると何も起こりません。

ご協力いただければ幸いです。

Answer 1

これは、ベータ版とRC版のaurelia-dialogの変更を破ったためです。

this.dialogService.open({...}).then(...)をthis.dialogService.open({...}).whenClosed().then(...)に変更してみてください。

RC-1のリリースノート：https://github.com/aurelia/dialog/releases/tag/1.0.0-rc.1を参照してください。

アウレリアブログでブログの記事もあります：私もこの問題が発生していhttp://blog.aurelia.io/2017/04/27/aurelia-dialog-release-candidate/