Наблюдаемый от события не активируем обнаружениеИзменить на угловой - PullRequest
Новая
       7

Наблюдаемый от события не активируем обнаружениеИзменить на угловой

0 голосов
/ 03 октября 2019

Я пытался решить эту проблему в течение нескольких дней: я делаю приложение, которое использует угловые и электронные, поэтому я всегда в производственной среде в угловых. Я использую ipcMain и ipcRender для связи между основным процессом и рендерингом для отображения csv-файлов. Проблема в том, что создание наблюдаемого объекта fromEvent, по-видимому, не вызывает угловое изменениеDetection. Сначала я решил проблему с помощью ChangeDetectorRef, но это создает странное поведение компонентов материала. Чтобы не ошибиться, я скопировал код из приложения tour of heroes, если наблюдаемое имеет значение ([1,2,3]), все работает ... если я изменяю происхождение наблюдаемого в fromEvent, оно небольше не работает.

сервис: 

export class PresetService {

 constructor(private electronService:ElectronService){}

  read() {
    this.electronService.ipcRenderer.send('read_presets');
  }

  getPresets():Observable<Preset[]> {
    //return of([1,2,3,4]) //this works
    this.read()
    return fromEvent(this.electronService.ipcRenderer,'preset_res').pipe(
      map(_=>_[1]),
      tap(_ => console.log('fetched presets',_))//in the log i see an array of preset objects
    );
  }

}

компонент 

export class PresetsComponent implements OnInit {

  public presets:any[] //already tried to use observable here and ngFor with async pipe and the behavior was the same
  selected = new FormControl(0);

  constructor(private presesetService:PresetService/*, private cdr: ChangeDetectorRef*/ ) {

  }
  
  ngOnInit() {
    this.getPresets()
  }

  getPresets(): void {
    this.presesetService.getPresets()
    .subscribe(presets => {
      this.presets = presets
      //this.cdr.detectChanges() //if i add this i see all presets but material tabs do not works properly
    });
  }

  addTab(selectAfterAdding: boolean) {
    this.presets.push(new Preset());

    if (selectAfterAdding) {
      this.selected.setValue(this.presets.length - 1);
    }
  }

  removeTab(index: number) {
    this.presets.splice(index, 1);
  }

}

и шаблон 

<div>
  <button mat-raised-button
          class="example-add-tab-button"
          (click)="addTab(selectAfterAdding.checked)">
    Add new Preset
  </button>
  <mat-checkbox #selectAfterAdding> Select preset after adding </mat-checkbox>
</div>

<mat-tab-group [selectedIndex]="selected.value"
               (selectedIndexChange)="selected.setValue($event)">
  <mat-tab *ngFor="let preset of presets; let index = index" [label]="preset.ID">
    Contents for {{preset.ID}}

    <button mat-raised-button
            class="example-delete-tab-button"
            [disabled]="presets.length === 1"
            (click)="removeTab(index)">
      Delete Preset
    </button>
  </mat-tab>
</mat-tab-group>

1 Ответ

0 голосов
/ 03 октября 2019

Устранена проблема с переносом назначения в ngZone.run ()

соответствующий код: 

getPresets(): void {
      
    this.presetService.getPresets()//wrap at this level do not solve the issue
    .subscribe(presets => {
      this.zone.run(()=>{
        this.presets = presets //wrapping only this solve the issue
      })
    });
    
  }

спасибо морозно за подсказку!

...