收到 IPC 消息后视图不刷新

Question

我的组件正确地接收到一条消息（正如我在调试器中看到的那样），但它的视图没有刷新。 IPC listener中是否需要手动操作？

这是我的组件HTML代码：

<div> {{text}} </div>

这是 TypeScript：

 import { Component, OnInit } from '@angular/core';
 import { ipcRenderer } from 'electron'

 @Component({
   selector: 'app-receiver',
   templateUrl: './receiver.component.html',
   styleUrls: ['./receiver.component.scss']
 })
 export class ReceiverComponent implements OnInit {
   text: string;

 constructor() { }

 ngOnInit() {
  ipcRenderer.on('msg', function (event, arg){
    this.text=arg;
     })
   }
 }

我希望页面从 Electron 进程接收到的新字符串显示在页面上，但它没有发生

Answer 1

IPC 的事件处理在 angular 区域之外运行。该事件不是所谓的 'monkey patched'。您应该在 ngZone.run 调用中应用更改。除此之外，您正在使用 function 关键字，这会导致 this 上下文更改为该函数，并且无法再访问 class this。使用箭头符号：

constructor(readonly nz: NgZone) { }

ngOnInit() {
  ipcRenderer.on('msg', (event, arg) => {
    this.nz.run(() => this.text = arg);
  });
}

不要忘记在 ngOnDestroy 中 'unlisten' for msg，否则你会在销毁的指令上触发 detectChanges，而 angular 不喜欢那样:)

收到 IPC 消息后视图不刷新

View does not refresh on IPC message received

ipc

electron

angular