Dynamically insert angularJS contextMenu on HTML tags

Question

I am using this angularJS contextMenu module on my application and I need to insert this inside some HTML tags dynamically. I am trying something like this but it isn't working.

e.client.html("<a context-menu=\"menuOptions\">click here</a>");

I have menuOptionsdeclared on my scope like this:

$scope.menuOptions = [
    {
        text: 'Object-Select',
        click: function ($itemScope, $event, modelValue, text, $li) {
            $scope.selected = $itemScope.item.name;
        }
    },
    {
        text: 'Object-Remove',
        click: function ($itemScope, $event, modelValue, text, $li) {
            $scope.items.splice($itemScope.$index, 1);
        }
    }
];

Someone know how to do that?

scipper · Accepted Answer · 2017-11-21 18:57:50Z

1

You need angular to compile your dynamic context menu, so it can handle the context-menu directive. The best way doing this is:

//define the Html to insert in a variable:
var dynContextMenu = "<a context-menu=\"menuOptions\">click here</a>";

//append to content
e.client.html(dynContextMenu);

//then compile it
$compile(dynContextMenu)($scope);

I hope this helps.

answered Nov 21, 2017 at 18:57

scipper

3,1813 gold badges27 silver badges43 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Dynamically insert angularJS contextMenu on HTML tags

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related