$ionicConfigProvider
Ionic automatically takes platform configurations into account to adjust things like what transition style to use and whether tab icons should show on the top or bottom. For example, iOS will move forward by transitioning the entering view from right to center and the leaving view from center to left. However, Android will transition with the entering view going from bottom to center, covering the previous view, which remains stationary. It should be noted that when a platform is not iOS or Android, then it’ll default to iOS. So if you are developing on a desktop browser, it’s going to take on iOS default configs.
These configs can be changed using the $ionicConfigProvider
during the configuration phase
of your app. Additionally, $ionicConfig
can also set and get config values during the run
phase and within the app itself.
By default, all base config variables are set to 'platform'
, which means it’ll take on the
default config of the platform on which it’s running. Config variables can be set at this
level so all platforms follow the same setting, rather than its platform config.
The following code would set the same config variable for all platforms:
$ionicConfigProvider.views.maxCache(10);
Additionally, each platform can have it’s own config within the $ionicConfigProvider.platform
property. The config below would only apply to Android devices.
$ionicConfigProvider.platform.android.views.maxCache(5);
Usage
var myApp = angular.module('reallyCoolApp', ['ionic']);
myApp.config(function($ionicConfigProvider) {
$ionicConfigProvider.views.maxCache(5);
// note that you can also chain configs
$ionicConfigProvider.backButton.text('Go Back').icon('ion-chevron-left');
});
Methods
views.transition(transition)
Animation style when transitioning between views. Default platform
.
Param | Type | Details |
---|---|---|
transition |
string
|
Which style of view transitioning to use.
|
- Returns:
string
value
views.maxCache(maxNumber)
Maximum number of view elements to cache in the DOM. When the max number is
exceeded, the view with the longest time period since it was accessed is removed. Views that
stay in the DOM cache the view’s scope, current state, and scroll position. The scope is
disconnected from the $watch
cycle when it is cached and reconnected when it enters again.
When the maximum cache is 0
, the leaving view’s element will be removed from the DOM after
each view transition, and the next time the same view is shown, it will have to re-compile,
attach to the DOM, and link the element again. This disables caching, in effect.
Param | Type | Details |
---|---|---|
maxNumber |
number
|
Maximum number of views to retain. Default |
- Returns:
number
How many views Ionic will hold onto until the a view is removed.
views.forwardCache(value)
By default, when navigating, views that were recently visited are cached, and
the same instance data and DOM elements are referenced when navigating back. However, when
navigating back in the history, the “forward” views are removed from the cache. If you
navigate forward to the same view again, it’ll create a new DOM element and controller
instance. Basically, any forward views are reset each time. Set this config to true
to have
forward views cached and not reset on each load.
Param | Type | Details |
---|---|---|
value |
boolean
|
- Returns:
boolean
views.swipeBackEnabled(value)
By default on iOS devices, swipe to go back functionality is enabled by default. This method can be used to disable it globally, or on a per-view basis. Note: This functionality is only supported on iOS.
Param | Type | Details |
---|---|---|
value |
boolean
|
- Returns:
boolean
scrolling.jsScrolling(value)
Whether to use JS or Native scrolling. Defaults to native scrolling. Setting this to
true
has the same effect as setting each ion-content
to have overflow-scroll='false'
.
Param | Type | Details |
---|---|---|
value |
boolean
|
Defaults to |
- Returns:
boolean
backButton.icon(value)
Back button icon.
Param | Type | Details |
---|---|---|
value |
string
|
- Returns:
string
backButton.text(value)
Back button text.
Param | Type | Details |
---|---|---|
value |
string
|
Defaults to |
- Returns:
string
backButton.previousTitleText(value)
If the previous title text should become the back button text. This is the default for iOS.
Param | Type | Details |
---|---|---|
value |
boolean
|
- Returns:
boolean
form.checkbox(value)
Checkbox style. Android defaults to square
and iOS defaults to circle
.
Param | Type | Details |
---|---|---|
value |
string
|
- Returns:
string
form.toggle(value)
Toggle item style. Android defaults to small
and iOS defaults to large
.
Param | Type | Details |
---|---|---|
value |
string
|
- Returns:
string
spinner.icon(value)
Default spinner icon to use.
Param | Type | Details |
---|---|---|
value |
string
|
Can be: |
- Returns:
string
tabs.style(value)
Tab style. Android defaults to striped
and iOS defaults to standard
.
Param | Type | Details |
---|---|---|
value |
string
|
Available values include |
- Returns:
string
tabs.position(value)
Tab position. Android defaults to top
and iOS defaults to bottom
.
Param | Type | Details |
---|---|---|
value |
string
|
Available values include |
- Returns:
string
templates.maxPrefetch(value)
Sets the maximum number of templates to prefetch from the templateUrls defined in
$stateProvider.state. If set to 0
, the user will have to wait
for a template to be fetched the first time when navigating to a new page. Default 30
.
Param | Type | Details |
---|---|---|
value |
integer
|
Max number of template to prefetch from the templateUrls defined in
|
- Returns:
integer
navBar.alignTitle(value)
Which side of the navBar to align the title. Default center
.
Param | Type | Details |
---|---|---|
value |
string
|
side of the navBar to align the title.
|
- Returns:
string
value
navBar.positionPrimaryButtons(value)
Which side of the navBar to align the primary navBar buttons. Default left
.
Param | Type | Details |
---|---|---|
value |
string
|
side of the navBar to align the primary navBar buttons.
|
- Returns:
string
value
navBar.positionSecondaryButtons(value)
Which side of the navBar to align the secondary navBar buttons. Default right
.
Param | Type | Details |
---|---|---|
value |
string
|
side of the navBar to align the secondary navBar buttons.
|
- Returns:
string
value