Ion-tab disabled works statically from html, not from controller js

ionic-v1
1

Ionic noob here. Have a tab declared like this:

 <!-- Tab Go -->
 <ion-tab id="tabgo" title="Go" disabled="true" icon-off="ion-ios-thunderstorm-outline" icon-on="ion-ios-thunderstorm" href="#/tab/go">
        <ion-nav-view name="tab-go"></ion-nav-view>
  </ion-tab>

…with the tab disabled. This works fine and the tab/ icon is in fact disabled when displayed. But when a button on another tab is clicked I want to change disabled on the go tab to false and re-enable / re-activate the tab. I do this in the other tab’s controller:

.controller('HomeCtrl', function($scope) {
    $scope.signIn = function(){
	document.getElementById('tabgo').disabled = false;
    };
})

When I set a break on the .disabled = false line, run the code, and go to the console and inspect the element I see this:

image
Screen Shot 2015-04-26 at 7.29.16 PM.png1676×378 55.7 KB

…which doesn’t jibe with the displayed or operational state of the tab. Further, setting the disabled property to false does not re-enable the tab. Not sure what I’m missing here. Any suggestions? Thanks in advance…

2

Bump - anyone…?

3

So either no one has this problem, I’m seriously off base, or it’s just not an interesting use-case for most folks. Seems odd to me compared to hiding / unhiding tabs.

4

Did you ever get this figured out? I too need to disable a tab based on variable condition - I want the tab icon to appear but not function until another state is first changed. I would settle for this…however I would actually prefer to pop a message or got a temp page that says “Content disabled until destination address is entered”.