2017-02-08 12 views
2

私はAngular 2でWebアプリケーションを作成しています。いずれかのページでは、ユーザーのコメントを有効にするために、jquery-commentsというjQueryプラグインを使用します。Angular 2でこのjQueryイベントハンドラを作成する方法は?

jqueryコメント「返信」ボタンをクリックすると、カスタムダイアログボックスが表示されます。それは私のような何かをするだろう、jQueryの

enter image description here

た場合:

$('.jquery-comments .reply').on('click', function (event) { 
    event.preventDefault(); 
    ...here I can show my custom dialog box or something else   
}); 

しかし、どのように私はjqueryの-コメントプラグインを変更せずに、角度2で同様のイベントハンドラを作成するのでしょうか?

答えて

0

あなたがそうのような角度でクリック...

いくつかのコンポーネントのHTML

<div class="reply" (click)="showComments($event)"></div> 

は$イベントを渡すと、あなただけのイベントを渡すことになるだろうと同じイベントオブジェクトを与えるイベントハンドラをアタッチすることができますバニラjsとビューは は、このオブジェクトのnativeElementプロパティを使用することができますが初期化された後、あなたが@ViewChild()を使用して テンプレートからDOM要素を参照する必要があり、あなたの角度成分で

いくつかのコンポーネント

class someComponent { 

     constructor() { 
    } 

    showComments(e) { 
     e.preventDefault(); 
     // do the jquery stuff here. 
    } 

    } 
+0

いいえ動作しません。私が書いたように、あなたが示唆するように(クリック)イベントハンドラを追加する場合は、jquery-commentsプラグインのコードを変更する必要はありません。 – brinch

+0

jqueryプラグインのコードを変更することで意味が分からないと思います。 –

+0

「返信」ボタンは、jquery-commentプラグインの一部です。もし私が

をやるべきなら、私はプラグインの中でこれを行う必要があります。 – brinch

0

jQueryに渡します。

JQueryStaticとして$(またはjQuery)を宣言すると、jQueryへの型付きの が与えられます。

参照:https://stackoverflow.com/a/30662773/510788

あなたのコンポーネントにはjQueryを注入した後、クリックをキャッチすることができます。

関連する問題