如何将事件绑定到指令？

我有我的指令，我想传递给$事件的指令。如何将事件绑定到指令？

我在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

如何将事件绑定到指令？

回答

相关问题