angularjs - Adding ng-show from a directive without directly compiling or using templates -

angularjs - Adding ng-show from a directive without directly compiling or using templates -

given html in form of

<p ng-repeat="item in items" my-directive="item">{{item.description}}</p>

i dynamically add together ng-show within my-directive. seems not easy perhaps be. if my-directive element instead of attribute done through template, alas same back upwards not exist attributes.

my first effort used $compile service described @ add directives directive in angularjs. however, approach relies on directive beingness higher priority other, , hence applied before ng-repeat.

my current approach manually re-create source ng-show:

.directive('mydirective', ['$animate', function ($animate) { function toboolean(value) { if (typeof value === 'function') { value = true; } else if (value && value.length !== 0) { var v = angular.lowercase("" + value); value = !(v == 'f' || v == '0' || v == 'false' || v == 'no' || v == 'n' || v == '[]'); } else { value = false; } homecoming value; } homecoming { scope: true, link: function(scope, elem, attrs) { scope.$watch("mywatchexpression", function(isactive) { $animate[toboolean(isactive) ? 'removeclass' : 'addclass'](elem, 'ng-hide'); } ); } }; }])

however, that's not long-term solution requires updating custom directive whenever angular changes internally.

is there way perhaps request directive injectable , apply element (without disrupting higher priority directives such ng-repeat)?

edit give context

the directive i'm trying create tabbed items. ideally markup looks like:

<tab-container> <button ng-repeat="tab in tabs" tab-button="{{tab.id}}">{{tab.name}}</button> <div ng-repeat="tab in tabs" tab-view="{{tab.id}}"><ng-include src="{{tab.template}}"/></div> </tab-container>

thus ng-click , ng-class directives on tab-button, , ng-show on tab-view.

angularjs