No change detected from Electron ipc-message event

[OlsonDev]

I have a case where the automatic change detection is not working. I'm making an Electron app with multiple windows that send messages to one another via IPC. Here's some code:

(function(app) {
    app.LinkListComponent = ng.core.Component({
        selector: 'link-list'
        , providers: [ app.FooService ]
        , directives: [ ng.common.NgFor, ng.common.NgIf ]
        , template: `
            <ul>
                <li *ngFor="#link of links">{{ link }}</li>
            </ul>
            <input type="button" value="Add link" (click)="addLink('this triggers <ul><li>... refresh')"/>
        `
    }).Class({
        constructor: function(foo) {
            this.links = foo.links; // Note: Same array reference as app.FooService instance
        }, addLink: function(link) {
            this.links.push(link);
        }
    });
    app.LinkListComponent.parameters = [[ app.FooService ]];
})(window.app || (window.app = {}));

Then elsewhere:

const links = []; // outside of FooService to force singleton (not sure if matters yet)

app.FooService = function() {
    this.links = links;
    this.open = function(url) {
        initSubject(); // subject is an Electron BrowserWindow instance
        subject.openDevTools();
        subject.loadURL(url);
        subject.show();
        subject.webContents.addListener('ipc-message', (e, args) => {
            const obj = args[0];
            if (obj.type === 'links') {
                // TODO: Keep stable sorted, figure out why _.clone() is necessary
                const newLinks = _.clone(obj.links);
                Array.prototype.push.apply(newLinks, links);
                _.remove(links);
                // this should  trigger <ul><li>... refresh but it doesn't
                Array.prototype.push.apply(links, _.uniq(newLinks)); 
                return;
            }
            console.log(obj);
        });
    };
};

[robwormald]

this is to be expected, as Zone.js knows nothing about electron's IPC stuff and therefore can't patch it.

You should be able to inject NgZone (ng.core.NgZone in ES5) into your service, and then do

zone.run(function(){
 Array.prototype.push....
})

[OlsonDev]

I tried that before posting this issue and just now; no luck. I don't understand the zone stuff enough but from what I gather, zone.run is probably in the wrong zone context when I call that? If that's the case, how do I ensure it's in the right context?

[OlsonDev]

My bad, I missed the injection bit you mentioned. That leads me to another question then: how do I inject it into a service? My service is just a JS function, not wrapped with any ng2 stuff like ng.core.Component. I went that route because the docs give a JS function FriendsService example. Should I be wrapping it with something else?

[robwormald]

http://plnkr.co/edit/sOKQAzwa0sSOu3haSI0b?p=preview something like that.

also, try typescript. you'll love it :)

see also: https://github.com/robwormald/ng2-electron which you might find interesting.

[OlsonDev]

Alright, I got my code working. Thanks!

I've been considering it - just a lot of other new stuff to learn ATM. :-)

Cool, I'll check out your repo.

>>>> comment removed by @IgorMinar because it violates our code of conduct - not constructive, not respectful) <<<<

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}