durandal composition animation

Question

is there any way transition could be applied to the composition binding with durandal like it is on rout binding? what I mean is that if I have

<div data-bind="compose: ActiveView, transition: 'entrance'"></div>

Active view is a Knockout Observable and When I change it I would like to have transition effect like while routing with some progress ring indicating transition process.

here is how my viewmodel

import ko = require('knockout');
class Shell implements iModule
{
activate: (context: Object) => void;
ActiveView: KnockoutObservable<any>;
SwitchView: () => void;

constructor() {
    this.activate = this._activateCallback;
    this.ActiveView = ko.observable<string>('parts/welcome');
    this.SwitchView = this._activateView;
}

private _activateView() {
    this.ActiveView('parts/about');
}

private _activateCallback (ctx: Object) {

}
}
export = Shell;

Answer 1

Transitions work with any compose binding. You have an error in your syntax though. It should look like this:

<div data-bind="compose: { model: ActiveView, transition: 'entrance' }"></div>