I am facing a challenge where I need to incorporate a directive as a class in my code. Specifically, I want to use the following pattern:
ng-class='{"some-directive":1'}
However, the directive can only be registered using the following pattern (you can test it in the provided Plunker link):
class='some-directive'
The main issue is that I only want to apply the directive to the "rename" option in my context menu:
<li ng-class="{'renameDirective':(menu.name == 'Rename')}" ng-repeat="menu in contextmenu
Is there a way to achieve this? Additionally, I would like to pass an argument to the renameDirective, perhaps like this:
ng-class="{'renameDirective
: directiveArg':(menu.name == 'Rename')}"
Something similar to:
<div renameDirective="directiveArg"></div>
UPDATE:
For now, I have a workaround solution below. However, I believe there might be a better way to handle this situation (potentially utilizing ng-class for a cleaner approach).
<ul>
<li ng-repeat="menu in contextmenu">
<div ng-switch on="menu">
<div ng-switch-when="Rename">
<button some-directive="Rename">button{{$index}}</button>
</div>
<div ng-switch-default>
<button>button{{$index}}</button>
</div>
</div>
</li>
</ul>
You can find a similar discussion post that I referred to here