ionic3 emoj表情包插件 emoji-picker

最新推荐文章于 2024-08-16 16:06:53 发布

weixin_30532987

最新推荐文章于 2024-08-16 16:06:53 发布

阅读量436

点赞数

文章标签： json

原文链接：http://www.cnblogs.com/hsl-shiliang/p/8709441.html

版权

1、效果演示：

2、安装扩展包依赖

npm i @ionic-tools/emoji-picker --save

3、app.module.ts中导入插件

 1 import { EmojiPickerModule } from '@ionic-tools/emoji-picker';
 2 
 3 @NgModule({
 4     ...
 5     imports: [
 6       ...
 7       EmojiPickerModule.forRoot()
 8       ],
 9     ...
10 })
11 export class AppModule {}

4、详情页使用：

 1 import { EmojiPickerModule } from '@ionic-tools/emoji-picker';
 2  
 3 @NgModule({
 4     ...
 5 imports: [
 6    ...
 7  EmojiPickerModule
 8 ],
 9    ...
10 })
11 export class SharedModule {
12 　　
13 　　public toggled: boolean = false;
14 　　public emojitext: string;
15 　　//切换当前选中的emoje表情
16 　　public handleSelection(event) {
17   　　this.emojitext = this.emojitext + " " + event.char;
18 　　}
19 
20 }

5、html中调用：

1 <ion-textarea [(ngModel)]="emojitext"></ion-textarea>
2 
3 <button ion-button clear icon-only (click)="toggled = !toggled" [(emojiPickerIf)]="toggled" [emojiPickerDirection]="'top'"
4       (emojiPickerSelect)="handleSelection($event)">
5       ?
6 </button>

转载于:https://www.cnblogs.com/hsl-shiliang/p/8709441.html