Getting events from aurelia-event-aggregator in app.ts from element in node_modules

Help Requests
1

Hi,
I’m trying to use the event aggregator to publish an event when a specific error is received so I only have to registered to this event when in my app to show the same dialog from everywhere.

The event is published from a service created to support our restAPI and is imported in the application to the node_modules.

This is the code related to my problem:

app.ts

import { EventAggregator } from "aurelia-event-aggregator";
import { autoinject, LogManager } from "aurelia-framework";
import { I18N } from "aurelia-i18n";
import { AuthenticationService } from "genius-services";
import { F7App } from "pages/shared/f7-app";
@autoinject()
export class App extends BasePage {

    constructor(i18n: I18N, f7App: F7App, private authenticationService: AuthenticationService, eventAggregator: EventAggregator) {
        super(i18n, f7App, eventAggregator);
        this.i18n.setLocale(navigator.language)
            .catch(e => { logger.error(`Loading failed with ${e.name}: ${e.message}`); });

        this.eventAggregator.subscribe("genius-services:invalid-session", () => {console.log("event?????????????????????")});
    }
}

rest-service-base.ts

import { EventAggregator } from "aurelia-event-aggregator";
import { HttpClient } from "aurelia-fetch-client";
import { autoinject, LogManager } from "aurelia-framework";

@autoinject()
export class RestServiceBase {
    public async setHttpFetchQuery<T>(uri: string, errorMessage: string, httpMethod?: string, body?, useStandardConfig?: boolean) {
        const baseUrl = useStandardConfig ? window.location.origin : this.server;
        const completeUri = `${baseUrl}${uri}`;

        const response = httpMethod !== undefined ? await this.httpClient.fetch(`${completeUri}`, { method: httpMethod, body: JSON.stringify(body) })
            : await this.httpClient.fetch(`${completeUri}`) as any;
        try {
            const jsonResponse = await response.json();
            jsonResponse.Result = this.jsonToCamelOrToPascal(jsonResponse.Result);
            if (jsonResponse.Messages.length > 0 && jsonResponse.Messages[0].Key === "InvalidSession") {
                this.eventAggregator.publish("genius-services:invalid-session", "data");
            }
            return jsonResponse as any as RestApiResult<T>;
        }
        catch (e) {
            logger.error(`${errorMessage}: ${e.message}`);
            return e;
        }
    }
}

I basically try to do something similar to the "i18n:locale:changed" event in aurelia-i18n. Unfortunately, I can’t get the subscription to catch the event. Both part of the code works if it is called from the same side of the code (all in the service or all in the app), so the event aggregator is definitely working.

Thanks in advance of the help!

2

I don’t see a constructor in your rest service.
Where does it get the instance of EventAggregator?

1 Like
3

Here is the constructor for rest-service-base:

    constructor(geniusCookieService: GeniusCookieService, public eventAggregator: EventAggregator) {
        this.httpClient = new HttpClient();
        this.server = geniusCookieService.getCookie().geniusRestApiServer;
        if (this.server.slice(-1) !== "/") {
            this.server += "/";
        }
    }

Also, I’m not sure if it was clear, but the two file are not in the same project. I thought about that, and I guess there is a huge chance that they don’t have the same instance of event aggregator because of that. If so, I don’t know how to “sync” them to get the same instance.

Thanks again and sorry for the delay.

4

so strange…
can you recreate the relevant part
by forking this: https://stackblitz.com/edit/aurelia-base?file=app.js

or this https://gist.run/?id=8ae06845f2bdf4d533b072c00da82614