我得到了这个表情符号:
https://github.com/one-signal/emoji-picker
我正在考虑制定一个指令,这是使用表情符号选择器的功能:
$(function() {
// Initializes and creates emoji set from sprite sheet
window.emojiPicker = new EmojiPicker({
emojiable_selector: '[data-emojiable=true]',
assetsPath: 'lib/img/',
popupButtonClasses: 'fa fa-smile-o'
});
// Finds all elements with `emojiable_selector` and converts them to rich emoji input fields
// You may want to delay this step if you have dynamically created input fields that appear later in the loading process
// It can be called as many times as necessary; previously converted input fields will not be converted again
window.emojiPicker.discover();
});
这是表情符号的htlm用法:
<p class="lead emoji-picker-container">
<textarea class="form-control textarea-control" rows="3" placeholder="Textarea with emoji Unicode input" data-emojiable="true" data-emoji-input="unicode"></textarea>
</p>
我怎么能为我的角项目做这个?谢谢你的帮助!
答案 0 :(得分:2)
ng-emoji-picker是https://github.com/OneSignal/emoji-picker
的角度指示它删除了Original Emoji Picker使用的wysiwyg编辑器,它将您的输入/文本区域转换为div,而只是在当前文本框或输入上添加表情符号选择器图标并使用unicode添加表情符号
答案 1 :(得分:0)
如果有人在为Angular 2寻找表情符号选择器,我会在搜索两天后发现这个非常有用的jQuery插件: EmojiOne Area
如果要调用是在组件中声明一个全局变量(您要在其中使用它),请declare const jQuery: any
,然后确保在ngAfterViewInit()
中使用它。 ngAfterViewInit()
将确保您的DOM已准备就绪,否则您将收到错误消息,指出emojioneArea不是函数。
通过按ID或类选择输入元素来使用它:
jQuery(".your-input-selector").emojioneArea();
答案 2 :(得分:0)
您也可以将其用于带有角度的EmojiOne Area
// Document ready
angular.element(document).ready(function () {
}
我唯一的问题是,在<md-input-container>
内的textarea中使用它时,它会使行为混乱,并且与我的模型接缝的连接将断开。选择器也会显示在其他元素下。我还没有尝试过ng-emoji-picker。
答案 3 :(得分:-1)
表情符号选择器与角形效果很好 易于使用。
使用webpack导入库
import 'angular-emoji-picker-extended/dist/js/emoji-picker';
在视图中
<span container-id="txtPostMessage" emoji-picker="post.message" output-format="unicode" placement="right-relative" title="Emoji"></span>
确保在控制器中初始化模型,瞧!