Angular Emoji Button Picker
Important / Credits
This package is based on https://github.com/lbertenasco/ng-emoji-picker Since that repository uses only input fields, I have rewritten it to use a button
Usage
Install through npm or yarn
npm install ng-emoji-button-picker --save # Angular >= 6 # same with yarn yarn add ng-emoji-button-picker
In your module file for your angular project.
; @
Components
<emoji-input>
Parameters
[popupAnchor]
: ['top' (default) : 'bottom']
Where to anchor the emoji popup
[inputElement]
: Reference of the input element where you want to emoji to be inserted
[onEnter]
: method to run when users presses enter key. If you want to use your parent scope inside the function make sure to bind the function ([onEnter]="onEnterFunction.bind(this)"
)
[(model)]
: model value to two-way bind to input fields ngModel
[inputClass]
: assigns a class name to the emoji input or textArea.
[closeAfterSelection]
: boolean: defaults true
. If true closes the emoji popup after selecting an emoji.
(setPopupAction)
: outputs a binding function to this.openPopup(status: boolean = null)
. Call the function without parameters to toggle the picker popup.
(keyup)
: outputs the keyup event on the textarea/input.
(focus)
: outputs the event when focus on the textarea/input.
(blur)
: outputs the event when blur outside the textarea/input.
(emojiClick)
: outputs the emoji character clicked.
Example
@ inputText: string = ''; openPopup: Function; @ inputEl; { thisopenPopup = fn; }