从 Electron 接收 ipcRenderer.on 后,Angular 2 视图未更新
Posted
技术标签:
【中文标题】从 Electron 接收 ipcRenderer.on 后,Angular 2 视图未更新【英文标题】:Angular 2 view not updating after receiving ipcRenderer.on from Electron 【发布时间】:2017-10-03 03:15:38 【问题描述】:我正在使用 ipcRenderer 从我的 main.js 中的浏览器对话框中检索文件夹路径。
但由于某种原因,它不会更新我视图中的文本字符串。
我知道为了让它工作,我需要做一个 setTimeout 来更新它(感谢谷歌!)。但由于某种原因,这不起作用。
我使用的代码如下。
import Component, OnInit from '@angular/core';
declare var electron: any;
@Component(
selector: 'my-app',
template:
//added (click)="debug()" in order to update the path manually
`<h1 (click)="debug()">My First Angular 2 App with Electron</h1>
<br />Project Path: [(path)]
<button (click)="btnClick()">Select project path</button>
<br /> <br />`
)
export class AppComponent implements OnInit
ipc:any;
path:string;
constructor()
this.path = __dirname;
ngOnInit()
electron.ipcRenderer.on('project-path-reply', (event, arg) =>
setTimeout(() =>
this.path = arg.return[0];
console.log('updated')
)
)
btnClick()
electron.ipcRenderer.send('project-path',1);
debug()
console.log(this.path);
谁能指出我正确的方向这是我第一个使用电子的应用程序。
亲切的问候,
Tyvo
【问题讨论】:
你试过contructor(private ref ChangeDetectorRef)
然后在回调ref.detectChanges()
?
【参考方案1】:
对于这种情况,请使用NgZone
import Component,NgZone from '@angular/core';
现在,在NgZone
提供的.run()
函数中更新您的应用
constructor(zone:NgZone)
ipcRenderer.on('project-path-reply', (event, arg) =>
this.zone.run(()=>
// the code that requires change detection here, just like below //
this.path = arg.return[0];
console.log('updated')
);
);
这很可能是因为电子正在更新角度变化检测区域之外的值。
【讨论】:
以上是关于从 Electron 接收 ipcRenderer.on 后,Angular 2 视图未更新的主要内容,如果未能解决你的问题,请参考以下文章
为啥我的 ipcMain 没有发送到 Electron 中的 ipcRenderer?
preload.ts 中的 contextBridge.exposeInMainWorld:ipcRenderer 接收到来自 main.ts 的消息但渲染器没有得到它
require 没有在带有 ipcRenderer.on 的 Electron-React-Webpack-Typescript 应用程序中定义