2017-04-10 29 views
0

私はjquery関数を囲むAngular 2コンポーネントでメソッドを呼び出す方法を理解しようとしています。jqueryの呼び出し角度2コンポーネントメソッド

私はAngular 2プロジェクトでhttps://github.com/mdehoog/Semantic-UI-Calendarコンポーネントを使用しています。私はjQueryのための型のconstとして宣言しましたが、その後、私のngOnInitに私はこれを行う:

jQuery('#monthYearPicker').calendar({ 
     type: 'month', 
     maxDate: new Date(), 

     // minDate and maxDate take new Date() objects 

     onChange: function(date, text, mode) { 
      console.log("Date is " + date); 
      console.log("Text is " + text); 
     } 
    }); 

予想通り、私はコンソールのログを見ています。私が今得意ではないのは、私はどのようにして私のコンポーネントにコールバックして、私はこの時点で「普通の」ことができるのでしょうか?たとえば、Webサービスを照会し、選択した日付を渡すメソッドを呼び出す必要があります。

答えて

0

注:あなたが作る、Jqueryangular2/typescriptコードを扱っている場合あなたの代わりにngOnInit()

fetcheData:any; 

ngViewAfterInit(){ 

jQuery('#monthYearPicker').calendar({ 
     type: 'month', 
     maxDate: new Date(), 

     // minDate and maxDate take new Date() objects 

     onChange: (date, text, mode) => {    //used arrow function()=> 
      console.log("Date is " + date); 
      console.log("Text is " + text); 

      //call your webapi here on onChange event 
      this.calltoWebapi();      //calling a function 
     } 
    }); 
} 

calltoWebapi(){ 
    //actual http call and get some response 
    //this.fetchedData=response; 
} 
ngViewAfterInit()ライフフックでのjQueryを使用してください
1

あなたのonChangeイベント機能でthis.sampleFun()を使用してください。しかし、最初にすべての、あなたがcurrent contextを保つために、このよう無名関数のあなたの定義の変更を行う必要があります。

onChange: (date, text, mode) => { 
    // console.log("Date is " + date); 
    // console.log("Text is " + text); 
    this.sampleFun(); 
} 
関連する問題