January 13, 2016

Ionic loading

❮❮ Previous
Next ❯❯

Ionic loading : Ionic provides beautiful loading functionality which represents the activity and prevents users interaction until the activity is completed. $ionicLoading.show() is used to show ionic default loader and $ionicLoading.hide() is used to hide the loader. Here we are going to explain the functionality with example and demo.

Ionic loading

Here is default Ionic loader –

Ionic loader Example

<script type="text/javascript">
angular.module('todo', ['ionic','ngCordova'])
.controller('MainCtrl', function($scope, $http, $ionicLoading) {

  $scope.show = function() {
    $ionicLoading.show();
  };
  $scope.hide = function(){
    $ionicLoading.hide();
  };
});
</script>

Try it »

Note $loading service must be imported in controller to implement the loading functionality ie. .controller(‘MainCtrl’, function($scope,$ionicLoading) {…});

The above example will produce the following output-

Ionic loading loader example


Advertisements

Add Comment

📖 Read More


❮❮ Previous
Next ❯❯
,