javascript - Why AngularJS view doesn't change when navigating? -

i new in angularjs. write code navigation , work perfect. it's stop working when integrate metropreloader in angularjs service. change browser url view not update. if remove metropreloader service it`s works again.

here code :

service :

voiceappcontrollers.factory('appservice', function ($http, $log, $window) {     return {          showwaitbar : function() {             metropreloader.setup({                 logourl: "content/images/logo.png",                 logowidth: "100px",                 logoheight: "100px",                 multiplebgcolors: ["#ca3d3d", "#f58a16", "#32a237", "#a110e6"],                 delay: "unlimited"             });             metropreloader.run();         },          hidewaitbar : function() {             metropreloader.close();         }     }; }) 

controller :

voiceappcontrollers.controller('logincontroller', ['$scope', '$http', '$location', '$timeout', 'appservice', 'notificationservice',     function ($scope, $http, $location,$timeout, appservice, notificationservice) {         var onsuccess = function () {             notificationservice.pushnotifaction("service update successfully.");         };          var onerror = function () {             notificationservice.pushnotifaction("service update fail.");         };          $scope.login = function () {             var credentials = "grant_type=password&username=" + $scope.loginmodel.username + "&password=" + $scope.loginmodel.password;             console.log(credentials);              appservice.showwaitbar();             $http({                 method: 'post',                 url: appservice.loginurl,                 data: credentials,                 headers: { 'content-type': 'application/x-www-form-urlencoded' }             })                 .success(function (data) {                     console.log(data.access_token);                     appservice.updateauthinfo(data.username, data.access_token);                     appservice.hidewaitbar();                     $location.path(appservice.routes.dahboard);                 })                 .error(function () {                     appservice.clearauthinfo();                     appservice.hidewaitbar();                     $location.path(appservice.routes.login);                     notificationservice.pushnotifaction("login fail. wrong username , password.");                 });         };      } ]);  

when comment appservice.showwaitbar() , appservice.hidewaitbar() works fine.

i defiantly miss don`t figure out is.

thnaks.

update 1:

my app.js :

var voiceappcontrollers = angular.module('voiceappcontrollers', []);  var voiceapp = angular.module('voiceapp', ['ngroute', 'voiceappcontrollers', 'kendo.directives']);  voiceapp.config(['$routeprovider',   function ($routeprovider) {       $routeprovider.         when('/organization', {             templateurl: 'templates/organizationtemplate.html',             controller: 'organizationcontroller'         }).when('/service', {             templateurl: 'templates/servicetemplate.html',             controller: 'servicecontroller'         }).when('/login', {            templateurl: 'templates/logintemplate.html',            controller: 'servicecontroller'         }).when('/dashboard', {            templateurl: 'templates/dashboardtemplate.html',            controller: 'dashboardcontroller'        }).         otherwise({             redirectto: '/login'         });   }]); 

login view :

<div ng-controller="logincontroller">     <form name="loginfrom" novalidate ng-submit="login(loginfrom)">         <input type="hidden" ng-model="loginmodel.id" />          <h1>login</h1>         <label>need text</label>         <div>             <label>username :</label>             <div class="input-control text">                 <input type="text" placeholder="your username" required ng-model="loginmodel.username" />             </div>         </div>         <div>             <label>password :</label>             <div class="input-control password">                 <input type="password" placeholder="your password" required ng-model="loginmodel.password" />             </div>         </div>         <div class="offset3">             <input class="primary" type="submit" value="update" ng-disabled="loginfrom.$invalid" />         </div>     </form> </div> 

my dashboard view :

<div ng-controller="dashboardcontroller">     <h1>dashboard</h1>     <input type="button" value="next" /> </div>