ui-mention icon indicating copy to clipboard operation
ui-mention copied to clipboard

Make it easier to customize

Open ProLoser opened this issue 10 years ago • 6 comments

Right now, I just exposed everything via the directive controller. Although this gives you a LOT of control, it requires you to make your own secondary directive. For now, I actually think this isn't the most terrible thing in the world (because you have a LOT of control over how you want your template to get generated, have no obfuscation around the <textarea>, can customize almost any and all behavior, etc).

That said, I'd be curious to explore an automatic way of translating element attributes into controller property overrides. So <textarea ui-mention find-choices="doSomething"> automatically gets mapped onto the controller instead of the default one. This may involve using bindToController however I was struggling with trying to get it to work and had no real success.

ProLoser avatar Aug 03 '15 05:08 ProLoser

This directive is riddled with bugs, but has a nice API : https://github.com/aurbano/smart-area

amcdnl avatar Sep 28 '15 21:09 amcdnl

I don't like the api. Hard coded to Twitter and you have big configuration objects as a property, something I have been think about moving away from

ProLoser avatar Sep 30 '15 06:09 ProLoser

Your module is really easy to understand and use.. until the moment I want to some processing with the "selected mentions" in my outer controller / directive... hmm .

So far all I got is the resulting text , something like

hello , @[steve rodriguez:hi] , @[kyle corn:123] , @[megan burgerpants:ab-] hurray !

Let me see if I can do something. Thanks for the cool module

ghost avatar Jan 05 '16 04:01 ghost

@phuyem the $mention object contains any additional data you might need, including meta data. I think we could iterate on whether the model should contain a human-readable string, a tagged string, or an object with everything all tied together, but I feel like the raw being the model and all other stuff treated as meta-data (available through $mention) works well enough.

ProLoser avatar Jan 14 '16 06:01 ProLoser

Actually, I did modify your code for our PRODUCTION to something similar to the way ui-tinymce boostrap :

 <textarea 
            ui-mention="uiMentionOptions"                        >
     </textarea>

and from MY controller:

                // ui mention options
                $scope.uiMentionOptions = {
                    minLength: 1,
                    srcFn:
                        //_.throttle(
                        function (match, mentions) {
                        var params = {action: 'searchUsers', q: match[1], limit: 6};

                        return  UserService. remote('GET', params, null, true).then(function(response){
                            return response.data;
                        });
                        //return scope.choices;

                    },
                        //300),
                    encodeFn :  function (mention) {
                        return '<a href="'+ mention.avatar.url + '" >' +           $scope.uiMentionOptions.labelFn(mention)  + '</a>' ;
                    },
                    labelFn :  function (mention) {
                        return mention.displayName ;
                    },


                };

So this way, I can interact with your ui-mention directly from my controller (where many things are workign together there) without creating a new directive

ghost avatar Jan 18 '16 11:01 ghost

@amcdnl smart-area rocks! 10 times better than this crap.

victorhazbun avatar Feb 13 '18 20:02 victorhazbun