CODEWITHSUNDEEP
angularjsangular-ui-routerionic-framework
Anson Tan
Anson Tan

Reputation: 1246

Trigger a function while change state(route)

I am building a simple page applicatio(Mobile) by using IONIC + AngularJS I want to trigger a function when I change state. Below is my code to control the state.

var app = angular.module('App', ['ionic'])
var busyIndicator = new WL.BusyIndicator('content');
app.factory("busyIndicator",function()
{
    return busyIndicator;
}       
);
app.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
 )
if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
  cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if (window.StatusBar) {
  // org.apache.cordova.statusbar required
  StatusBar.styleDefault();
}
});
})

app.config(function($stateProvider, $urlRouterProvider) {
 $stateProvider
 .state('login', {
  url: "/login",
  views: {
      'viewLoader':{
      templateUrl: "views/login.html"}
  }
 })
.state('menu', {
  url: "/menu",
  abstract: true,
  views: {
      'viewLoader':{
      templateUrl: "views/menu.html",
          controller: 'AppCtrl'
    }
  }
 })
  .state('menu.customer', {
    url: "/customer",
    views: {
      'menuContent': {
        templateUrl: "views/customer.html",
            controller: 'CustomerCtrl'
      }
    }
  });

 $urlRouterProvider.otherwise('/login');
 })
.directive('appReady', function() {
 return {
  restrict: 'A',
   link: function(scope, element, attrs){
  console.log("Done rendering body");
  WL.App.hideSplashScreen();
 }
};
});

I had seen an similar question at this link: how to call a function in angularjs after change url

How should I add a function into this code ?

Upvotes: 2

Views: 616

Answers (2)

maddygoround
maddygoround

Reputation: 2300

try using "$stateChangeSuccess" event

Upvotes: 0

user1334319
user1334319

Reputation:

This is one approach you could take, example for one destination route:

.state('example', {
            url: '/url',
            templateUrl: 'example.html',
            controller: 'ExampleController',
            resolve : {
                Timestamp: ['TimestampService', function(TimestampService){
                    return TimestampService.update(new Date());
                }]
            }

Upvotes: 1

Related Questions