Вид DOM не обновляется, угловой не находится в зоне - PullRequest
Новая
       21

Вид DOM не обновляется, угловой не находится в зоне

0 голосов
/ 09 октября 2018

У меня проблема с зоной, и я не могу заставить ее работать.Я новичок в Angular, но немного разбираюсь в javascript.

Так в чем проблема, я не могу обновить представление.

Я использую стороннюю библиотеку для ионного BLE, ииспользуйте это в провайдере

provider / communication-controller.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 () вызывается для подписки на обещание. При получении данных handlereceiveddata () вызывается.

Для передачи данных вызывается ble_communication_controller (), эта функция принимает обратный вызов, который сохраняется.Когда устройство отвечает, вызывается handlereceivedata ().Затем вызывается обратный вызов, который хранится в вызове ble_communication_controller ()

. Я создал страницу, конфигурацию, которая содержит HTML-файл и файл scss

the configuration.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.

И, если обновление не обновлено, я попытался ngzone.run или timeout и markForCheck ().Но это не работает.

Спасибо за помощь

...