角度2を使用するHTML5イベント処理（onfocusとonfocusout）

Question

私は日付フィールドがあり、デフォルトでプレースホルダーを削除します。

私はプレースホルダを除去するためイベントonfocusoutとONFOCUS javascriptのを使用しています。

angular2指令の使用について助けてもらえますか？

このように解決しようとしますが、入力フィールドのタイプをリセットする際に問題が発生しています。

import { Directive, ElementRef, Input } from 'angular2/core'; 
@Directive({ 
    selector: '.dateinput', 
    host: { 
    '(focus)': 'setInputFocus()', 
    '(focusout)': 'setInputFocusOut()', 
    }}) 

    export class MyDirective { 
     constructor(el: ElementRef) { this.el = el.nativeElement; console.log(this.el);} 

     setInputFocus(): void { 
     //console.log(this.elementRef.nativeElement.value); 
     } 
    } 

Answer 1

次のように代わりにonfocusとonfocusout

の(focus)と(focusout)を使用してみてください： - また、あなたがこのように使用することができます

<input name="date" type="text" (focus)="focusFunction()" (focusout)="focusOutFunction()"> 

： -

一部の人々が好みます標準形式として知られている接頭辞の代替語：

<input name="date" type="text" on-focus="focusFunction()" on-focusout="focusOutFunction()"> 

see hereを結合イベントについての詳細を知っています。

あなたがホスト要素が指定されたイベントを発したときに装飾されたメソッドを呼び出しますあなたのユースケース

角度のためHostListnerを使用する必要があります。 @HostListenerは、コールバック/イベントハンドラメソッドのデコレータです。

私の更新作業プランカを見てください。

実施例Working Plunker