EmojiPicker
This library was generated with Angular CLI version 14.0.5.
See live demo here.
This library will help you to use Unicode emojis. There are 8 categories with 1523 emojis.
Attributes
| Attributes | Description |
|---|---|
| @Input() element: any |
You should send your input / textarea element via element, so library can detect actions from input / textarea (like cursor change) |
| @Input() emojiPickerOptions: IEmojiPickerOptions |
You can add options like
|
| @Output() selectEmojiEvent: EventEmitter< string >() |
Event will be fired when emoji selected and will return input value and selected emoji IInputValue {value: string; selectedEmoji: string;}
|
Example and Sample Code
- Import 'EmojiPickerModule' in your app module
import { EmojiPickerModule } from "emoji-picker";
@NgModule({
imports:[
..
EmojiPickerModule
..
]
})- Add 'emoji-picker' in your component html
<input #emojiInput type="text">
<emoji-picker [emojiPickerOptions]="emojiPickerOptions"
(selectEmojiEvent)="selectEmoji($event)"
[element]="emojiInput"></emoji-picker>- Add a method in your component class to listen for selectEmojiEvent event
selectEmoji(inputValue: IInputValue): void {
console.log('Input value - ' + inputValue.value);
console.log('Selected emoji - ' + inputValue.selectedEmoji);
}- Add styles and assets folder in your angular.json
"styles": [
..
"node_modules/@eff-custom-plugins/emoji-picker/lib/assets/sass/emoji-picker.scss"
..
]AND
"assets": [
..
{
"glob": "**/*",
"input": "node_modules/@eff-custom-plugins/emoji-picker/lib/assets",
"output": "/assets/"
}
..
]