从普通javascript调用角度组件函数

问题描述

我正在为我的网络应用程序使用 angular，我需要在我的一个页面上使用蓝牙。 我正在使用 loginov-rocks/bluetooth-terminal(https://github.com/loginov-rocks/bluetooth-terminal) 进行蓝牙连接，它可以工作，我可以连接我的设备并从中查看数据。现在我遇到的问题是我无法将数据从我的接收函数获取到我的角度组件，我可以将数据打印到控制台，但这不是我想要的，我想解析我的数据并在我的角度组件中设置一些变量它。这是我的代码：

let bluetooth = new BluetoothTerminal();

bluetooth.receive = function (data) {
    console.log(data);
    //i want to call ParseBtData here from my angular component to parse data
    //or somehow send data and cach it for parsing inside my component
};

export class GpsAppComponent extends AppComponentBase implements OnInit
{
//all the angular stuff

    parseBtData(data) {
        //parse my BT data and set some variables inside my component...
    };
}

我已经尝试在组件内部创建 BluetoothTerminal，但我仍然无法调用任何函数来解析我的数据。甚至有可能做到这一点，还是有其他方法可以解决我的问题？

解决方法

一般来说，如果您创建一个对象 javascript，您可以使用声明来实现，那么唯一的方法就是覆盖“接收到的”数据。但是因为一个不受 Angular 控制的事件发生了变化，你需要告诉 Angular “某些东西”在 Angular 之外发生了变化，所以你需要使用 ngZone，比如：

//DISCLAMER: I don't know if work

declare var bluetooth = new BluetoothTerminal();

export class AppComponent implements AfterViewInit
{
   constructor(private ngZone:NgZone,private dataService:DataService){}
   ngAfterViewInit(){
       bluetooth.receive = (data)=> {
           this.ngZone.run(()=>{
              this.dataService.sendData(data)
           })
       };
   }
}

那么你只需要在你的服务中定义

bluethoodData:Subject<any>=new Subject<any>()
sendData(data:any)
{
   this.bluethoodData.next(data)
}

并且您可以在任何组件中订阅 dataService.bluethoodData

   this.dataService.bluethoodData.subscribe(res=>{
       console.log(res)
   })

,

我通过在组件内移动蓝牙并执行以下操作来解决我的问题：

this.bluetooth.receive = (data) => {
        //console.log(data);
        this.writeToTerminalConsole(data);
    };