Accessing controller inside overridden template-url of uib-tab

Question

angular-bootstrap version used : 1.2.0
angular-version : 1.5.7

I am trying to override header html of uib-tab like below,

<li ng-class="{active: active, disabled: disabled}" class="uib-tab">
    <a ui-sref="MyController.overviewStateUrl" ng-click="select()" uib-tab-heading-transclude>{{heading}}</a>
</li>

When the page is rendered, the value for ui-sref is taken as MyController.overviewStateUrl instead of the real value which is stored in overviewStateUrl attribute of MyController. Is there any way to do it?

I tried to put it inside interpolation, but it returns empty string. Here's the plunker.

Answer 1

Have you tried as like below code?

<a ui-sref="{{MyController.overviewStateUrl}}" ng-click="select()" uib-tab-heading-transclude>{{heading}}</a>