Random thoughts & observations

From the mundane to the profound and everything in between here’s what’s rocking our world

Removing the back button text in Ionic Framework Apps

Posted: December 27, 2015
Written by: Saints At Play
Category: Ionic Framework

There's no doubt that the Ionic Framework makes developing Mobile Apps easier to accomplish but as great as the framework is the documentation can sometimes be a little lacking.

This is especially true where it comes to figuring out how to hide the back button text in iOS Apps.

Resolving this however is quite straightforward.

Locate the app.js file for your project and under the following run method:

.run(function($ionicPlatform) 
{

  // Initialisation code for your App contained in here

})

Place the following configuration block:

.config(function($ionicConfigProvider) 
{
  // Remove back button text completely
  $ionicConfigProvider.backButton.previousTitleText(false).text('');
})

This declaration, using the $ionicConfigProvider (which helps manage system specific configuration options), instructs Ionic to configure our back button to:

  • Not use the previous title for the back button text content
  • And set the text to an empty string

By placing this in the app.js bootstrap file we ensure that the configuration is made globally available to our App. If we had placed this in a single controller this would only be scoped to the view that the controller is associated with meaning that navigating to other views would NOT hide the back button text.

Now, when you rebuild and republish your App to an iOS device, you should notice the back button text no longer displays as you navigate between different screens.

« Return to Posts

Comments

There are no comments

Posting comments after three months has been disabled.