我很关心在离子3中显示表情符号。
我创建了我使用表情符号的聊天应用程序,但是当我发送表情符号时,它会向后者发送一条空信息。
那么,我该如何发送表情符号? 或者,如何将表情符号转换为unicode纯文本?
谢谢大家,我等着您的反馈!
以下是一些代码:
Message.ts
import { Component, ElementRef } from '@angular/core';
import { EmojiPickerItem } from './../../model/emoji-picker/emoji-picker.interface';
.......
export class MessagePage {
selectedImojiPickerIten: EmojiPickerItem;
showEmojiPicker = false;
editorMsg = "";
constructor(navParams: NavParams,....){}
switchEmojiPicker() {
this.showEmojiPicker = !this.showEmojiPicker;
if (!this.showEmojiPicker) {
// this.messageInput.setFocus();
}
this.content.resize();
this.scrollToBottom();
}
emoji(event) {
this.selectedImojiPickerIten = event;
this.editorMsg += this.selectedImojiPickerIten.emoji
}
Message.html
<ion-footer [style.height]="showEmojiPicker ? '255px' : '55px'">
<ion-grid class="input-wrap">
<ion-row>
<ion-col col-2>
<button ion-button clear icon-only item-right (click)="switchEmojiPicker()">
<ion-icon name="md-happy"></ion-icon>
</button>
</ion-col>
<ion-col col-8>
<ion-textarea #chat_input [(ngModel)]="editorMsg" #chat_input placeholder="Message" (keyup.enter)="sendMsg()" (ionFocus)="onFocus()"
(ionChange)="isTyping()">
</ion-textarea>
</ion-col>
<ion-col col-2>
<button ion-button clear icon-only item-right class="'message-editor-button' + message.ownership" (click)="sendMsg()">
<ion-icon name="ios-send" ios="ios-send" md="md-send"></ion-icon>
</button>
</ion-col>
</ion-row>
</ion-grid>
<emoji-picker (selectedImojiPickerIten)="emoji($event)" *ngIf="showEmojiPicker" [(ngModel)]="editorMsg"></emoji-picker>
</ion-footer>
Message page when sending an emoticon
Message page after sending and leaving the page, the message becomes blank
因此,一旦表情符号在消息中发送,消息就会留空而没有内容。我无法在聊天应用程序中发送和接收表情符号。