terranisu / angular-emoji-picker

A simple Emoji picker
MIT License
35 stars 62 forks source link

Directive does not work #13

Open hamidhadi opened 8 years ago

hamidhadi commented 8 years ago

When I add this line of code to my project, I don't get any emoji picker and the span is empty. <span style="margin: 0 20px;" emoji-picker="fidiPlusPost.Message" placement="right" title="Emoji" recent-limit="12"></span>

But it's generated the i tag, however, it's not showing me anything.

terranisu commented 8 years ago

Hi @Hamiid. Thanks for your feedback. I'll try to look into it, but I can't tell you when exactly :(

hamidhadi commented 8 years ago

Hi @terranisu. Thanks for your response.

ulurusolutions commented 7 years ago

i had that issue until i added the css lib/angular-emoji-picker/dist/css/emoji-picker.css check to ensure that it is added

sauldeleon commented 7 years ago

Hey! @hamidhadi @terranisu any news about that issue? I am having the same trouble.

As @ulurusolutions said, I have checked the emoji-picker.css is being downloaded and libraries is being loaded.

I am using Angular 1.6, maybe an version trouble?

Thanks in advance!

RomanGalochkin commented 7 years ago

In my case it did not work because in the template "templates/emoji-button-bootstrap.html" were used old Angular UI Bootstrap directives.

I fixed it like this:

angular.module("templates/emoji-button-bootstrap.html", []).run(["$templateCache", function ($templateCache) {
    $templateCache.put("templates/emoji-button-bootstrap.html",
        "<i class=\"emoji-picker emoji-smile\"\n" +
        "   uib-popover-template=\"'templates/emoji-popover-bootstrap.html'\"\n" +
        "   popover-placement=\"{{ !placement && 'left' || placement }}\"\n" +
        "   popover-title=\"{{ title }}\"></i>\n" +
        "");
}]);
sauldeleon commented 7 years ago

Thanks!! I will try it like you did!

taiebme commented 6 years ago

I replaced directive template within a decorator, like this:

`// get the angular-emoji-picker module
    angular.module('vkEmojiPicker').config(emojiPickerConfig)

function emojiPickerConfig($provide) {
    $provide.decorator('emojiPickerDirective', emojiPickerDecorator);

    function emojiPickerDecorator($delegate) {

        var directive = $delegate[0];

        directive.templateUrl = "template-path/your-template.html";

        return $delegate;

    }
};`