如何將事件綁定到指令？

我有我的指令，我想傳遞給$事件的指令。如何將事件綁定到指令？

我在div上放了一個元素，並通過事件傳遞了我正在丟棄的obj。

我的默認（onDropSuccess）=「onDropSuccess（$事件）」，拿起事件，我可以做任何事，但我怎麼通過的指令，通過它，因爲我想在（onDropSuccess）通過事件給我的colordrop指令，並在那裏做一些神奇的功能。

指令

import { Directive, ElementRef, Input, Output, EventEmitter, OnChanges, HostListener, ViewChild, ViewChildren} from "@angular/core"; 

@Directive({ 
    selector: '[colorDropModel]', 
    host: { 
    '(onDropSuccess)' : 'addColor()' 
    } 
}) 

export class colorDropDirective { 
@Input() colorDropModel: string; 
    constructor( private _elementRef: ElementRef){} 

    addColor(event) { 
    console.log('colorDropModel', event) 

    } 
}

HTML

<div 
    (onDropSuccess)="onDropSuccess($event)" 
    [colorDropModel]="$event" 
> 
    Dropable area 
</div>

來源

2017-06-21 Chris Tarasovs

你不必對DIV添加事件，如果你想爲你的指令訪問活動。在你的指令，你可以這樣做：

@HostListener('onDropSuccess') onDropSuccess() { 

    }

，如果你想要做的元素上一些神奇，你總是可以得到這樣

_elementRef.nativeElement

，並獲得元素保持後的元素參考你可以實現你的魔法。希望這會有所幫助！

來源

2017-06-21 20:57:22 fastAsTortoise

如何將事件綁定到指令？

回答

相關問題