我有一个应用程序正在监听来自 IPC 渲染器 channel 的传入数据。这是我的设置:
将数据发送到 Angular 应用程序(mainWindow)的容器:
mainWindow.loadURL('http://www.myangularapp.com') //where the angular app lives (example url).
mainWindow.webContents.on('did-finish-load', () => {
const data = { name: "John Doe", address: "123 Main St", city: "NY"}
mainWindow.webContents.send('data-from-container', data)
}
})
Angular 应用:
constructor(
private store: Store<fromStore.AppState>,
private cd: ChangeDetectorRef,
private zone: NgZone,
) {}
ngOnInit() {
this.isLoading = true;
if (this.electronService.ipcRenderer) {
this.electronService.ipcRenderer.on('data-from-container', (event, data) => {
this.zone.run(() => {
if(data){
setTimeout(() => {
console.log(data) // verified data is always received
this.formData = data; // property that form uses to populate data in the dom
this.prepopulateForm(data) // method that places incoming data in ngrx store
}, 1000)
}
})
})
}
this.store.select('containerData').subscribe(data => {
setTimeout(()=> {
console.log(data) // data is always being set in ngrx
this.isLoading = false
}, 5000);
})
}
每次 IPC channel 发出“data-from-container”事件时,数据总是从我的 OnInit 调用中收到,但数据并不总是在我的表单中设置!我注意到的模式通常是,当 Angular 应用程序首次在容器内启动时,数据不会预填充表单,在初始启动后,每次后续应用程序启动时,数据都会出现。
我已经尝试使用 ngZone、setTimeout 和 detectChange 方法来触发更改检测,以便 Angular 应用程序可以检测到新设置的 formData,但它并没有始终如一地预填充表单。有关如何解决此问题的任何建议?
最佳答案
我对 Electron 有非常基本的了解,所以我会尝试向您展示这个想法。对我来说,你的问题来自 View 的初始化。您不会丢失事件,因为您可以在控制台中看到它们,但在 View 中看不到,这加强了我的猜测。
如您的代码所示,您只发送一个事件(我想这只是为了测试理由),我们希望在呈现 View 时显示它。
在您的组件中添加一个主题,通知我们 View 已初始化,例如:
import { Subject, combineLatest, fromEvent } from 'rxjs';
viewInitialized$ = new Subject();
...
ngAfterViewInit() {
this.viewInitialized$.next();
}
...
现在我们可以等待两次发射,一次来自 ipcRenderer
,另一次来自 viewInitialized$
,使用 combineLatest
运算符。
在此之前,我们必须将 ipcRenderer
转换为 Observable
。从这个SO响应我们可以做 fromEvent(ipcRenderer,'data-from-container')
。如果它不起作用,我们可以使用另一个主题,每次我们在 ipcRenderer.on()
中收到一些东西时都会发出事件,第二种解决方案需要 ngZone。
ngOnInit() {
...
const containerData$ = fromEvent(this.electronService.ipcRenderer, 'data-from-container');
this.subscription = combineLatest(containerData$, this.viewInitialized$).subscribe(combined => {
const data = combined[0];
this.formData = data;
this.prepopulateForm(data)
})
...
}
ngOnDestroy() {
this.subscription.unsubscribe();
}
希望这对您有所帮助。
关于javascript - 从 Electron Container IPC Channel 接收数据时,变更检测会间歇性工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57048100/