2016-12-26 2 views
1

現在、私はAngular2プロジェクトでjQueryを使用するブートストラップdatepickerを実装しようとしています。ここで私はこれまで持っているものです。Angular2:javascript関数からのコールコンポーネントメソッド

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: `<input name="daterange" class="filter-date-range"/>` 
}) 

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); 

のこの作品は、ここで私が毎回アクティブdaterangepickerコールバック関数へのパスObservableServiceメソッド呼び出しにしようとしている以外、完璧な作品日付の値が変更されました。だから、私は得ている

Uncaught TypeError: Cannot read property 'updateFilter' of undefined 

エラーです。

Angular2コンポーネント、サービス、またはjs内のどのような関数を呼び出すことができますか?コールバックで

答えて

2

使用矢印機能:

 $('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); 
    ); 
+0

をこのような質問は、すでに何度も頼まれました。それらに答えるのではなく、重複としてフラグを立ててください。 –

+0

とにかくそれは正解です、ありがとう! –

+0

@Valikhan Akhmedovあなたはthis.httpに似た質問に次のことを少し見ていただけますか?//stackoverflow.com/questions/44111238/calling-a-method-in-the-component-from-a-javascript-angular2 – vigamage

関連する問題