要在Angular应用中更新视图时收到回调,您可以使用Angular的Zone.js库和Chrome扩展的消息通信机制。
首先,确保您的Angular应用中已安装了Zone.js。您可以通过运行以下命令来安装它:
npm install zone.js
接下来,创建一个名为chrome.service.ts的服务,它将处理与Chrome扩展的通信。在该服务中,我们将使用Chrome扩展的chrome.runtime.onMessage API来接收来自扩展的消息,并使用Zone.js的NgZone.run方法来确保回调在Angular的上下文中运行。以下是一个示例:
import { Injectable, NgZone } from '@angular/core';
@Injectable({
providedIn: 'root'
})
export class ChromeService {
constructor(private ngZone: NgZone) {
// 监听来自扩展的消息
chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
// 在Angular的上下文中运行回调
this.ngZone.run(() => {
// 在这里更新视图或执行其他操作
});
});
}
}
在上面的示例中,我们通过chrome.runtime.onMessage.addListener监听来自扩展的消息,并使用ngZone.run方法将回调包装在Angular的上下文中。这样做可以确保在回调中进行的更改会触发变更检测并更新视图。
请注意,上述示例中的代码只是一个框架,您需要根据您的具体需求进行修改和扩展。您可以根据需要更新视图,例如使用Angular的数据绑定机制,通过调用组件的方法来更新模板中的值等等。
上一篇:Angular / Bootstrap 4:多个卡片在多行中
下一篇:Angular / Cordova / IOS:如何在应用重新启动时持久化PHPSESSID cookie(使用withCredentials)