durandaljs child router deactivate event

Question

How to fire deactivate event when parent route changing. For instance in 'HTML Samples', when Master-Detail page is active, change view to another one. How to force dialog "Do you want to leave...." here?

Thanks Vladimir.

UPD:

Code from HTML Samples with replaced dialogs

project.js

define(['durandal/system', 'durandal/app'], function (system, app) {
    var ctor = function (name, description) {
        this.name = name;
        this.description = description;
    };

    ctor.prototype.canActivate = function () {
        return true; //!!! CHANGED!!!
    };

    ctor.prototype.activate = function () {
        system.log('Model Activating', this);
    };

    ctor.prototype.canDeactivate = function () {
        return false; //!!! CHANGED!!!
    };

    ctor.prototype.deactivate = function () {
       system.log('Model Deactivating', this);
    };

    return ctor;
});

Now you can not change detail view using select control. But easily can change whole module via navigation panel.

Matthew James Davis · Answer 1 · 2015-12-18T17:12:00.533

1

What you're looking for is the canDeactivate attribute. You can use the dialog plugin to display a dialog. If your canDeactivate function returns true, the view will deactivate. If it returns false, the view will remain.

Update

There is a bug in the router, that is a wontfix, where a child viewModel is not properly deactivated when the parent viewModel is deactivated / navigated away from. See here: https://github.com/BlueSpire/Durandal/issues/570

See http://durandaljs.com/documentation/Using-Activators/ http://durandaljs.com/documentation/Hooking-Lifecycle-Callbacks/

edited Dec 18 '15 at 17:12

answered Oct 03 '13 at 14:28

Matthew James Davis

12,134
7
61
90

CanDeactivate in HTML Example return false, but this method not executed if I change route via navigation menu. – vladimir-kazan Oct 03 '13 at 14:51
1

And canDeactivate is not fired for childRouter's routes during changing parent route. – vladimir-kazan Oct 03 '13 at 14:53

Morio · Answer 2 · 2016-03-29T18:09:25.747

1

This is a super late answering. I am maintaining an existing durandal app. The quick fix of mine is to manually call deactivate of child viewmodel in the deactivate of the parent. However, the child deactivate may be called multiple times.

Shell.prototype.deactivate = function(){
    this.router.activeItem().deactivate();
};

edited Mar 29 '16 at 18:09

answered Mar 29 '16 at 17:52

Morio

8,463
5
25
29

durandaljs child router deactivate event

2 Answers2