[SOLVED] Title in ion-tab with angular expression

Hi, is it possible somehome to fill title of an ion-tab with angular expression, for example

ion-tab  title="{{Home}}"

as you can see, title below icon is empty, while on navbar,

ion-view title="{{Home}}"

this is correctly set.

Yes you can, I do it for an app I’m building my self. Can you provide your markup for how you have the tabs? I suspect that you have the tabs style applied incorrectly. Does it look like this?

<ion-tabs class="tabs-light tabs-icon-top">
    <ion-tab title="{{page.id}}">

sure, here’s the markup:

<ion-tabs class="tabs-royal tabs-icon-top">

  <ion-tab  title="{{Home}}" icon-on="icon ion-ios7-camera" icon-off="icon ion-ios7-camera-outline" href="#/tab/home">
    <ion-nav-view name="tab-home"></ion-nav-view>
  <ion-tab title="massi" icon-on="icon ion-ios7-gear" icon-off="icon ion-ios7-gear-outline" href="#/tab/settings">
    <ion-nav-view name="tab-settings"></ion-nav-view>


while home view is

<ion-view title="{{Home}}">
	<ion-content class="has-header padding">

ah, last thing, Home is in $rootScope

Hmm, are you getting any errors in your console, seems like the correct markup. Would you mind posting a codepen?

hell, it works just like a charm on codepen!
Well, it’s just a simplified version of my code (there’s a localization factory in the middle that fills the titles, and I omitted it on codepen)
I’ll find out whats wrong, but i checked, no error on console
Thanks anyway, i keep you updated in case i find something interesting, but 99% it’s something stupid i wrote :wink:

Hmm I noticed one thing, you’re missing some quote marks around the abstract statement.

corrected. But still no luck: on codepen works fine, but doing

cordova serve android

with same code and markup

does not work

same result doing

ionic run android

and I also checked ionic versions , the stuff I refer via cdn on codepen is 0.9.26, as well as package installed on my machine.

Can you update to the 1.0 beta1? There could be some issues with android support with earlier versions of android

done. Sadly, still not working :frowning:

Damn, thought that would work.

The last thing I can think of is to remove it form the .run(function) and put it in a normal controller.

I got it that way in a codepen and things work fine. I just don’t have an android device on me at the moment for testing.

it works!

thank you very much! I still can’t understand what really made the difference: maybe the fact the vars are not valued in the cordova ready event handler! Thank you again

Awesome, glad to be able to help :smile:

in the meanwhile, I understood what is the problem:

here I forked your codepen, have a look at how i changed TabsCtrl:

.controller(‘TabsCtrl’, function($scope, $timeout){
$scope.Home = ‘Home’;
$scope.Settings = ‘Settings’;
$timeout(function() {
$scope.Home = ‘Hello’;
$scope.Settings = ‘World’;
}, 1000);

On android , after 1 second “Home” is not refreshed to “Hello” and “Settings” to “World” on tab titles (everywhere else instead it works): this could be a problem for who, for instance, requests a json and changes values accordingly when response is arrived. Is there a way perhaps to re-render tabs as a workaround?