Angular2 (Beta 11) throws exception when trying to wrap bootstrap-daterangepicker in component

问题

I am currently evaluating Angular2 (Beta 11). In a prototype I tried to wrap the bootstrap-daterangepicker (https://github.com/dangrossman/bootstrap-daterangepicker) in a component.

However I encountered some strange problem which I cannot explain. (It seems the problem occurs only with Beta 10 and 11. I was not able to reproduce the problem with Beta 8 and 9.)

Please have a look on this Plunkr: https://plnkr.co/edit/u958id

The DateRangePickerComponent looks like this:

import {Component, ElementRef, Inject, OnInit, EventEmitter} from 'angular2/core';

@Component({
    selector: 'date-range-picker',
    template: '<input type="text" class="form-control" />',
})
export class DateRangePickerComponent implements OnInit { 
    elementRef: ElementRef;

    constructor( @Inject(ElementRef) elementRef: ElementRef) {
        this.elementRef = elementRef;
    }

    ngOnInit() {
        var picker : any = jQuery(this.elementRef.nativeElement).find('input')
        picker.daterangepicker();
    }
}

Since the bootstrap-daterangepicker depends on Bootstrap/jQuery, I linked both libraries in the demo and use the ElementRef to get a grip on the element for initialization. For simplicity the demo code does not do anything useful with the selected dates.

To reproduce the problem:

1. Start the Plunkr.
2. Open the picker by clicking in the input element.
3. Select a start date followed by the end date.
4. Click on Apply to confirm the selection.
5. The picker disappears and the input element shows the selected dates. So far so good.
6. Click again on the input element and repeat the date selection.
7. Click again on Apply.
8. Now an exception is thrown (angular2.dev.js:23740):

EXCEPTION: Error: Task does not support cancellation, or is already canceled.

来源：https://stackoverflow.com/questions/36120808/angular2-beta-11-throws-exception-when-trying-to-wrap-bootstrap-daterangepicke