How to sync Aurelia EventAggregator with ViewModel lifecycle

Question

Basically I'm trying to navigate between two view (let's call them view1 and view2) models using Router.navigate function. I need to pass some data from view1 to view2 during navigation and for that I'm using event Aurelia's event aggregator like described bellow. Also, view2 has a ref item I need to access inside the subscription event.

View1

...
this.router.navigate("view2").then(() => {
    console.log("Publishing message");
    this.eventAggregator.publish(new ShareDataMessage(dataToShare));
});

View2

...
attached() {
    console.log("View attached");
    console.log("RefItem 1: " + this.refItem);
    this.eventAggregator.subscribeOnce(ShareDataMessage, message => {
        console.log("Event received")
        console.log("RefItem 2: " + this.refItem);
    });
}

However, if I run the app, and navigate from view1 to view2, i get the following output:

Publishing message
Event received
RefItem 2: null
View attached
RefItem 1: [object HTMLImageElement]

Obviously this was not the execution flow I expected. Can someone please explain me what I'm missing?

Sorry, my last comment got garbled.. What browser are you using? — Ashley Grant
The EventAggregator is useful for decoupling components from one another, but IMHO it's best suited for communicating between components within the same view. To communicate between views, I store data in window.localStorage instead. — Todd Price

Ashley Grant Ashley Grant · Accepted Answer · 2016-02-29T16:33:03

I've been unable to replicate your console log flow in Chrome 48. I will say that maybe you should consider placing the subscribeOnce call in the class's constructor to make sure the EventAggregator is aware of your subscription at the earliest possible time.

Please be aware that attached is part of the Component lifecycle and not part of the Router's page lifecycle, and thus you might be better off using the activate method instead of attached for whatever you are doing in this case. I can't be sure which is the correct method for your use case without more context, but you might want to double check. I should be available today on Gitter if you'd like to PM me for some more help.

How to sync Aurelia EventAggregator with ViewModel lifecycle

1 Answers