2

我有subscribes一个Observableservice. 当observable发出它的next值时,我的组件会发生一些变化。奇怪的是,组件是否会根据next值的生成方式更新视图。如果我正确理解这一点,一些事件已经被 angular 2 修补以触发更改检测,而有些事件还没有。MIDI 事件是那些没有的事件之一(这有点意思)。

如果服务查找单击事件以触发下一个值,则更改会反映在视图中。因此发生变化检测。

如果服务查找相同的键盘事件,则会发生更改检测。

但是,当服务使用 MIDI 事件时,不会发生更改检测。

这里有一些代码:

export class App {

  arr = [
      {id: 1, status: false},
      {id: 2, status: false},
      {id: 3, status: false}
    ];

  thing = new Subject<boolean>();

  constructor(private renderer: Renderer,
              private ser:Ser,
              private midi: MidiService) {}

  ngOnInit(){
    // listening to click events, will trigger change detection
    this.renderer.listenGlobal('document', 'click', (event) => {
      console.log("Left click", event);
      this.thing.next(1);
    });
    this.thing.subscribe( v => this.toggle(v));
    // my midi service events will call the toggle method however the 
    // changes won't be displayed in the view
    this.midi.notesPayed$.subscribe(v => this.toggle(v));
  }

这是一个 plnkr :

https://plnkr.co/edit/SS6jwgQg4TVdOCC05cNV?p=preview

我不确定这是 Angular 2 底层工作的错误还是功能。无论如何,我想知道为什么会发生这种情况。通过自己调用更改检测可以轻松解决具体问题,因此我不需要解决方案。

4

1 回答 1

6

这是已知的行为。zone.js 没有涵盖 MIDI API,因此 Angulare 不会收到运行更改检测的通知。

注入zone:NgZone并包装更改模型的代码this.zone.run(() => {...})

或通过调用在更改后注入cdRef:ChangeDetectorRef和调用更改检测this.cdRef.detectChanges()

于 2016-12-19T19:01:31.437 回答