Угловые 2 и RxJS Наблюдаемые только обновления по таймауту

Question

У меня есть инъекционная служба, которая выполняет BLE сканирует и передает результаты через наблюдаемый компонент страницы, где он затем сохраняется в локальной переменной и отображается (теоретически).

Проблема в том, что обновления, исходящие из метода startScanWithOptions, не приводят к обновлению представления, в то время как обновления из метода setInterval действительно вызывают обновление представления. Обновление превращает его в компонент страницы, поскольку все обновления записываются в консоль, но не отображаются до тех пор, пока обновления setInterval не вызывают рендер.

От инъекционной службы:

start() { 
    this.connections$ = new Observable((observer) => { 
     if (this.blePlugin) { 
      this.blePlugin.startScanWithOptions(
       [], 
       { reportDuplicates: true }, 
       (result) => this.observableScanResult(result, observer) 
      ); 
     } 
     setInterval(()=>{this.observableScanResult({rssi: 100}, observer)}, 1000); 
    }); 
    return this.connections$; 
} 

private observableScanResult(result, observer) { 
    observer.next(result); 
} 

От компонента страницы:

private startSelection() { 
    console.log('Scan Starting'); 
    this.connectionSource = this.connection.start(); 
    this.connectionSub = this.connectionSource.subscribe((result) => { 
     this.test.push(result.rssi); 
     console.log(this.test); 
    }); 
} 

Answer 1

обновлений идет от метода startScanWithOptions(), вероятно, работает за пределами угловых зон, а это означает, что асинхронное событие не обезьяна - передается Zone.js, например setTimeout() есть.

В startSelection(), вручную запустить обнаружение изменений внутри subscribe() обратного вызова:

export class MyComponent { 
    constructor(private _cdRef:ChangeDetectorRef) {} 
    private startSelection() { 
    console.log('Scan Starting'); 
    this.connectionSource = this.connection.start(); 
    this.connectionSub = this.connectionSource.subscribe((result) => { 
     this.test.push(result.rssi); 
     console.log(this.test); 
     this._cdRef.detectChanges(); // <--------- 
    }); 
} 

Смотрите также Triggering Angular2 change detection manually.