Angular2：从javascript函数调用组件方法

目前我正在尝试使用jQuery和我的Angular2项目实现bootstrap datepicker。 这是我到目前为止：

 import {Component, AfterViewInit, Injector, Inject} from '@angular/core'; import {ObservableService} from "../../../services/data-observable.service"; declare var $:any; @Component({ selector: 'date-range', moduleId: module.id, template: `` }) export class DateRange implements AfterViewInit { options = { locale: { format: 'YYYY-MM-DD' }, startDate: '2013-01-01', endDate: '2013-12-31'}; constructor(@Inject(Injector) private injector: Injector, @Inject(ObservableService) private _observable: ObservableService) { } ngAfterViewInit() { $('input[name="daterange"]').daterangepicker( this.options, function (start, end) { let obj = {}; obj['start'] = start; obj['end'] = end; this._observable.updateFilter(obj); } ); } } 

除了这段代码之外，一切都很完美

 this._observable.updateFilter(obj); 

这里我试图将ObservableService方法调用到daterangepicker回调函数，该函数激活每次更改日期值。 所以，我得到了一个

 Uncaught TypeError: Cannot read property 'updateFilter' of undefined 

错误。

如何在js函数中调用Angular2组件，服务或其他任何方法？

Answer 1

在回调中使用箭头function：

  $('input[name="daterange"]').daterangepicker( this.options, (start, end) => { let obj = {}; obj['start'] = start; obj['end'] = end; this._observable.updateFilter(obj); } ); 

或者使用函数的bind方法：

  $('input[name="daterange"]').daterangepicker( this.options, function (start, end) { let obj = {}; obj['start'] = start; obj['end'] = end; this._observable.updateFilter(obj); }.bind(this); );