Angular.js / Ionic make Tab-Button only clickable if var is set

how is it possible to not let the user click on the tab-bar, before a scope variable is set. The first view in my app is a view, where you can choose your city. The other Tabs (which uses the value of "city") should only be clickable after the user selects that city. The city is stored in $rootScope.selectedCity and this is the state where the city is needed:

.state('tab.friends', {
      url: '/friends/:selectedCity',
      views: {
        'tab-friends': {
          templateUrl: 'templates/tab-friends.html',
          controller: 'FriendsCtrl'
        }
      }
    })

Any suggestions for only making the tabs clickable after the user selects the city? Ty

You can handle ion-tab click by using on-select attribute, see : DOCS

on-select (optional) | expression
Called when this tab is selected.

In addition ion-tab supports ng-click as well: See $ionicTabsDelegate usage