动态数据绑定不起作用Angular Chrome Extension

Question

以Chrome扩展程序运行时，数据未绑定到Angular 6上。 下面是我的代码：

app.component.ts

constructor(){
    chrome.tabs.query({
      currentWindow: true,
      active: true
    }, function(tabs) {
    console.log(tabs[0]);
    if (tabs.length > 0) {
      if (tabs[0].url !== undefined && tabs[0].url !== null && tabs[0].url !== '') {
        this.tabId = tabs[0].id;  
        this.tabURL = tabs[0].url;
        console.log("url1"+this.tabURL);
        this.tabTitle = tabs[0].title;
        this.favIconUrl = tabs[0].favIconUrl;
      }
    }
    });
  }

app.component.html

   <p>Running on {{tabURL}}</p>

我们获取的数据对象和行已执行，但数据绑定未反映在UI上

后来我注意到，当我触发其他一些按钮单击事件时，UI会更新