0

我有一个与区域相关的问题,我无法让它工作。我是 Angular 的新手,但对 JavaScript 有一些基本的了解。

那么问题是什么,我无法更新视图。

我为离子 BLE 使用第三方库,并在提供程序中使用它

提供者/通信控制器.ts

set_ble_tolisten(){
    //subscribe to receive notification, rx channel
    console.log('  set_ble_tolisten' + NgZone.isInAngularZone());
    this.ble.startNotification(this.peripheral_object.id, 
    this.TRANSPARANT_SERVICE, this.TX_CHARACTERISTIC).subscribe(
        (data) => this.handlereceiveddata(data),
        () => console.log('Unexpected Error', 'Failed to subscribe for 
            temperature changes')
    )
}

ble_communication_controller(port,command,payload,payloadsize,
callback) 
{
    //create buffer
    var BLE_Sendbuffer= new Int8Array(payloadsize+10);
    var package_index = 0;
    this.generatePacketID();

    this.ble_send_que.push({
        "packetid" : this.packetid,
        "action" :   callback
    });

    //Generate send message
    BLE_Sendbuffer[ some data]

    //send message
    this.ble.write(this.peripheral_object.id,this.TRANSPARANT_SERVICE, 
    this.RX_CHARACTERISTIC,BLE_Sendbuffer.buffer).then(
        () => console.log('ble message send'),
        e => console.log('ble oops')
    );
}

handlereceiveddata(buffer:ArrayBuffer){
    var int8View = new Int8Array(buffer);
    var ReceivedPacketID = 0;
    console.log('handlereceiveddata ' + NgZone.isInAngularZone());

    //first check the header
    if( ((int8View[0] * 0x100) + int8View[1]) === this.HEADER)
    {
        //retrieve packetid from received packet
        ReceivedPacketID = ((int8View[2] * 0x100) + int8View[3]);
        if(ReceivedPacketID === 0) {
            console.log('orgin io or rs232');
     } else {
        //find function based on packetid, and execute
        let index_findresult = this.ble_send_que.findIndex(value => 
        value.packetid  === ReceivedPacketID);

        if(index_findresult != -1)
        {
            this.ble_send_que[index_findresult].action(int8View);
        }
        //remove object from array
        this.ble_send_que.splice(index_findresult, 1);
      }
}

调用 set_ble_tolisten() 来订阅 promise。当接收到数据时,会调用 handlereceiveddata()。

为了传输数据 ble_communication_controller() 被调用,这个函数接受一个回调,它被存储。当ble设备响应时,调用handlereceivedata()。然后调用存储在 ble_communication_controller() 调用中的回调

我创建了一个页面,配置,这个包含一个 ts 一个 html 和 scss 文件

配置.ts

ionViewDidEnter() {
    this.communicationController.set_ble_tolisten();
   this.sync_device_gui('IO-1');
}

sync_device_gui(port){
    console.log('call in zone ' + NgZone.isInAngularZone());
    var io_port = 0;
    if(port === ‘IO-1')
    {
        io_port = 0x05;
    }

    if(port === 'IO-2')
    {
        io_port = 0x06;
    }

    this.communicationController.ble_communication_controller(io_port,
    GET_IO_STATE,0x00,0,this.update_state_gui);
}

update_state_gui(data){
    //rule below added as explained in first comment (location ngzone.run).
    this.zone.run(() => {
        console.log('repsonse in zone ' + NgZone.isInAngularZone());
        console.log('io port state ' + data);

        console.log('repsonse in zone ' + NgZone.isInAngularZone());
        if(data[8] == 0){
            this.relay_1_toggle = true;
            this.relay_2_toggle = true;
            console.log('state is false set :'+ this.relay_1_toggle + ' 
            state :' +    this.relay_2_toggle );
        }

        if(data[8] == 1){
            this.relay_1_toggle = false;
            this.relay_2_toggle = false;
            console.log('state is true set :'+ this.relay_1_toggle + ' 
            state :' +    this.relay_2_toggle );
       }
     //rule below added as explained in first comment.(location ngzone.run).
    });
       //ruke below added as explained in first commen. (location markForCheck())
       this.cd.markForCheck();



}

加载页面时,调用 ionViewDidEnter ,问题是从提供程序调用 update_state_gui 。数据在此函数中接收。isInAngularZone,告诉我这是错误的,超出区域。relay_1_toggle 和 relay_2_toggle 是 html 中的切换按钮。

并且 get 没有更新,我尝试了 ngzone.run 或超时和 markForCheck()。但它不起作用。

谢谢你的帮助

4

0 回答 0