我有一段代码,本质上是监听加速度计和陀螺仪并执行一些操作。代码运行良好,但今天,我尝试将这个函数分成两半:
- 侦听部分已移至服务(sensors.ts(
- "对数据接收部分执行操作"已移至调用 ts 文件。
我面临着一个问题,如果我在回调中执行任何可能需要一些时间的操作,我就不会收到后续回调。
我遇到了一个问题,即我的回调确实被调用了,但是在我的回调代码中调用其他函数导致应用程序"卡住"(没有收到订阅的进一步更新(
这是代码:
在传感器中。
type SensorCallbackFunction = (data:any) => void;
注意(我也尝试使用Function
而不是上述类型(
startAllSensors(onAccData:SensorCallbackFunction, onGyroData:SensorCallbackFunction) {
// listen to acc. data
this.accSub = this.deviceMotion.watchAcceleration({ frequency: this.freq }).subscribe((acceleration: DeviceMotionAccelerationData) => {
console.log (">>>>>>>>>>>>> ACC CALLBACK")
onAccData(acceleration);
});
// listen to gyro data
this.gyrSub = this.gyroscope.watch({ frequency: this.freq })
.subscribe((gyroscope: GyroscopeOrientation) => {
console.log (">>>>>>>>>>>>> GYR CALLBACK")
onGyroData(gyroscope);
});
}
在调用此服务的组件中:
this.sensors.startAllSensors(this.accDataReceived, this.gyroDataReceived);
以及组件中的功能:
accDataReceived(data) {
console.log ("acc data:"+JSON.stringify(data));
}
gyroDataReceived(data) {
console.log ("gyr data:"+JSON.stringify(data));
}
这很好用
但是,当我扩展任一回调的功能时,我就停止接收后续通知(即,服务不会调用这些回调(。
但是当我扩展任一回调的功能以调用其他函数时,我停止收到后续通知(即,这些回调不由服务调用(
例如,我刚刚将这段代码添加到两个回调中:
let dataClone = data.map(x => Object.assign({}, x));
this.doMoreStuff();
繁荣,我停止获得订阅更新。我还尝试调用另一个在它们内部绘制图表的函数,但我遇到了同样的问题。
这让我相信我在某种程度上误解了函数回调应该如何工作以及回调代码的期望是什么。
谢谢。
事实证明,这是this
的问题。我错误地确定了根本原因。
Component A
在Service S
上调用一个函数,回调this.componentACallback
- 根据需要
Service S
componentACallback
正确调用函数 - 反过来,
Component A
内部componentACallback
通过调用this.doSomeOtherComponentAFunction()
进行更多处理
这就是事情破裂的地方
this
现在指向Service S
(调用方(,因此this.doSomeOtherComponentAFunction()
无效。
为什么这没有返回错误,以及为什么它会搞砸其他操作,例如componentACallback
中的简单console.logs
是未知的 - 我只能猜测它在某处搞砸了一些状态堆栈......
无论如何,因此修复是在传递回调引用时bind
this
,如下所示:
this.ServiceS.serviceSFunction(this.componentACallback.bind(this))
而不是this.ServiceS.serviceSFunction(this.componentACallback)