简体   繁体   中英

How to electron main.ts call or send message to angular component

I know how to send message or call function from angular app to electron main thread using ipc.

Bu I case I have some thread run in electron main thread like videos processing, and after some file complete process, electron require to send message and parameter for update angular GUI.

How can electron main thread (main.ts) call or invoke angular EventEmitter to send some data back to angular application.

After trying to solve this action for a few day. The solution I for this scenario is just create ipcMain handle in main.ts and store event object for callback to angular.

Project folder structure:

  • electron project
    • angular app
      • app.com.ts
      • app.com.html
    • main.ts
    • myelectron.com.ts
    • EventStore.ts
    • myelectonProcess.com.ts
  1. in angular app 1.1 constructor - register callback ipcRenderer to receipt message from electron 1.2 constructor - call ipcMain in electron to force create event object.

 constructor(private electronService: ElectronService) { this.registerIPC(); } registerIPC() { //register callback ipcRenderer to receipt message from electron this.electronService.ipcRenderer.on('my_process_msg', (event, result) => { this.processing = result; //TODO do you logic here }); //call ipcMain in electron to force create event object. this.electronService.ipcRenderer.send('my_process_msg'); }

  1. in electron main.ts when initialize just create myelectorn.com.ts object

 //TODO your code const main = () => { const myElec = new MyElectronCom(); myElec.registerIpcMain(); } //TODO your code main();

  1. in myelectron.com.ts - constructor - register ipcMain.handle to receipt first time connection from angular. And store that event object as global object for used in other electron app to send message back to angular via event object.

 export default class EventStore { MyProcessEvent:any = null; }

 export default class MyElectonCom { constructor() { this.registerIpcMain(); } registerIpcMain() { //register to getEvent object for send scraping process status message. const {ipcMain} = require('electron'); ipcMain.on('my_process_msg', (event) => { console.log('IPCMain event registered'); //keep event object to resend again and again msg back to angular app. EventStore.MyProcessEvent = event; event.reply('my_process_msg', {progress:0, msg:'Registered'}); //After this code and other class/coding can call EventStore.MyProcessEvent.send(....); }); } }

  1. in other code of electron developer can call event object to send data back to angular app.

 export default class MyElectonProcessCom { constructor() { } : : convertVideoFileProcessing(completedPercentage) { if(!empty(EventStore.MyProcessEvent){ EventStore.MyProcessEvent.send('my_process_msg','Convert video to mp3 '+completedPercentage+'%'); } } convertVideoFileCompleted() { if(!empty(EventStore.MyProcessEvent){ EventStore.MyProcessEvent.send('my_process_msg','Convert video to mp3 completed'); } } }

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM