javascript - durandaljsでcompositionCompleteイベントが呼び出されないのはなぜですか

Question

これが私のサンプル プロジェクト (8.3 MB) Visual Studio 2012 ソリューションです。

サンプル プロジェクトの圧縮

私の問題：

モジュールstep2とそのcompositionCompleteイベントは呼び出されません! モジュールstep1は同じイベントで正常に動作します!

この方法で問題を再現できます。

1.) アプリを起動

2.) [学年を参照] ボタンをクリックします。

3.) 「作成」ボタンをクリックします (SchoolyearWizard を開きます)。

4.) Wizard step1 が表示され、その compositionComplete イベントが呼び出されます

5.) 「次へ」ボタンをクリックします

6.) Wizard step2 が表示され、その compositionComplete イベントは呼び出されません

ここに重要なものだけを投稿します。これらは 5 つのモジュールです。

• SchoolyearDialog モジュールは、SchoolyearBrowser モジュールと SchoolyearWizard モジュールで構成されています。両方のモジュールは、'compose: activeScreen' バインディングで切り替えられます。
• SchoolyearWizard が読み込まれ、ユーザーが次のステップ ボタンをクリックして step2 を読み込むと、上記の 6 を参照してください。

学年ダイアログ

define(['durandal/app','plugins/dialog', 'knockout', 'services/dataservice', 'plugins/router', 'moment'], function (app, dialog, ko, dataservice, router, moment) {

    var SchoolyearDialog = function () {

        var self = this;
        self.activeScreen = ko.observable('viewmodels/SchoolyearBrowser'); // set the schoolyear browser as default module 

        app.on('activateStep1').then(function (obj) {
            self.activeScreen(obj.moduleId);
        });

        app.on('activateStep2').then(function (obj) {          
            self.activeScreen(obj.moduleId);
        });

        app.on('dialog:close').then(function (options) {

            dialog.close(self, options );
        });

        self.closeDialog = function () {            
            dialog.close(self, { isSuccess: false });
        }
    }

    SchoolyearDialog.show = function () {

        return dialog.show(new SchoolyearDialog());
    };   

    return SchoolyearDialog;
});

学年ブラウザ

define(['durandal/app', 'plugins/dialog', 'knockout', 'services/dataservice', 'plugins/router', 'moment'],
    function (app, dialog, ko, dataservice, router, moment) {
        var SchoolyearBrowser = function () {
            var self = this;

            self.create = function () {
                app.trigger('activateStep1', {
                    moduleId: 'viewmodels/SchoolyearWizard',
                    viewMode: 'create'
                });
            }

            self.open = function () {
                // do not open the wizard
            }

            self.compositionComplete = function (view) {
                debugger;
            }
        };
        return SchoolyearBrowser;
    });

学年ウィザード

define(['durandal/activator', 'viewmodels/step1', 'viewmodels/step2', 'knockout', 'plugins/dialog','durandal/app'], function (activator, Step1, Step2, ko, dialog, app) {

    var steps = [new Step1(), new Step2()];
    var step = ko.observable(0);   // Start with first step

    var activeStep = activator.create();

    var stepsLength = steps.length;

    var hasPrevious = ko.computed(function () {
        return step() > 0;
    });

    var caption = ko.computed(function () {

        if (step() === stepsLength - 1) {            
            return 'save';
        }
        else if (step() < stepsLength) {
            return 'next';
        }
    });

    activeStep(steps[step()]);

    var hasNext = ko.computed(function () {
        if ((step() === stepsLength - 1) && activeStep().isValid()) {
            // save
            return true;
        } else if ((step() < stepsLength - 1) && activeStep().isValid()) {

            return true;
        }
    });

    return {
        showCodeUrl: true,
        steps: steps,
        step: step,
        activeStep: activeStep,
        next: next,
        caption: caption,
        previous: previous,
        hasPrevious: hasPrevious,
        hasNext: hasNext
    };

    function isLastStep() {
        return step() === stepsLength - 1;
    }

    function next() {

        if (isLastStep()) {

            // Corrects the button caption when the user re-visits the wizard
            step(step() - 1);
            // Resets the wizard init page to the first step when the user re-visits the wizard
            activeStep(steps[0]); 
            debugger;
            // save;

        }
        else if (step() < stepsLength) {
            step(step() + 1);
            activeStep(steps[step()]);
            debugger;
            //app.trigger('activateStep2', {
            //    moduleId: 'viewmodels/step2'
            //});
        }
    }

    function previous() {
        if (step() > 0) {
            step(step() - 1);
            activeStep(steps[step()]);
        }
    }
});

ステップ1

define(function () {
    return function () {
        var self = this;

        self.isValid = function () {
            return true;
        }
        self.name = 'step1';

        self.compositionComplete = function (view) {
            debugger;            
        }
    };
});

ステップ2

define(function () {
    return function () {

        this.isValid = function () {
            return true;
        }
        this.name = 'step2';

        self.compositionComplete = function (view) {

           // I never get here WHY ???            
        }
    };
});