检查Angular2和Zone.js是否有计划任务

时间:2016-04-06 16:42:19

标签: angular

有没有办法检查是否有使用Angular2和Zone.js的计划任务?

我们说我有这个组件

import...

@Component({...})
export class MyComponent {

  public myMethod() {
    console.log('enter my method');
    setTimeout(function() { console.log('task1'); }, 1000);
    setTimeout(function() { console.log('task2'); }, 1500);
  }

}

我希望在task1task2完成后收到通知。

在我的应用程序组件中,我以这种方式订阅了onUnstableonStable个事件:

@Component({
  selector: 'app',
  directives: [MyComponent],
  template: `<mycmp></mycmp>`
})
export class AppComponent {

  constructor(private zone:NgZone) {
    console.log('start app component constructor');

    zone.onUnstable.subscribe(function(args){
      console.log('enter unstable');
    });

    zone.onStable.subscribe(function(args){
      console.log('enter stable');
    });
  }
}

所以,当我调用myMethod()时,我期望的是这个日志序列:

enter unstable
enter my method
task1
task2
enter stable

但我明白了:

enter unstable
enter my method
enter stable
enter unstable
task1
enter stable
enter unstable
task2
enter stable

1 个答案:

答案 0 :(得分:0)

让我试着解释一下结果。

这里共有三个微任务。

任务1

public myMethod() { ... }

任务2

setTimeout(function() { console.log('task1'); }, 1000);

任务3

setTimeout(function() { console.log('task2'); }, 1500);

前三行与Task1的开始和完成有关。

接下来的三行与Task2的开始和完成有关。

最后三行与Task3的开始和完成有关。

每个异步操作(包括可能调用myMethod的事件处理程序)都会创建一个新的微任务