8

Đây là cấu hình nhà nước:Chuyển nhà nước trong angularjs

angular 
    .module('grabhutApp', [...]) 
    .config(function ($stateProvider, $urlRouterProvider) { 

     $stateProvider 
      // ACCOUNT 
      .state('account', { 
       abstract: true, 
       url: '/account', 
       templateUrl: 'index.html' 
      }) 
      .state('account.main', { 
       url: '', 
       templateUrl: 'views/account/account.login.html', 
       controller: 'AccountController' 
      }) 
      . 
      . 
      . 
      // NO VIEWS 
      .state('nv', { 
       abstract: true, 
       url: '/nv' 
      }) 
      .state('nv.logout', { 
       url: '/logout' 
      }) 
    }); 

Các nv và các quốc gia phụ của nó sẽ không có quan điểm về thể chất hoặc điều khiển.
Tôi muốn chúng hoạt động dưới dạng liên kết gọi một số chức năng nhất định.

Dịch vụ cho gọi phương pháp logout:

angular.module('grabhutApp') 
    .factory('$grabhutAccountService', function ($state, $grabhutDataService) { 

     var methods = {  
      . 
      . 
      logoutUser: function() { 
       $grabhutDataService.user.removeSession(); 
       $state.go('account.main', {}, {location: 'replace'}); 
      } 
      . 
      . 
     }; 

     return methods; 
    }); 

Sau đó, một nút/link cho logout:

<a ui-sref="nv.logout" class="button icon icon ion-log-out button-large" menu-close></a> 

Những gì tôi muốn xảy ra là, khi nhà nước nv.logout đã được kích hoạt các
$grabhutAccountService.logoutUser() phải được gọi và phải chuyển hướng đến 'account.main'

Dưới đây là những gì tôi đã làm như vậy cho đến nay:
Tôi cố gắng để sử dụng quyết tâm trong nv.logout

.state('nv.logout', { 
    url: '/logout', 
    resolve: { 
     logout: function ($grabhutAccountService) { 
      $grabhutAccountService.logoutUser(); 
     } 
    } 
}) 

Dịch vụ này được gọi là trạng thái nhưng không chuyển hướng. Vì vậy, tôi đã thử một cách khác. Tôi đã thêm bộ điều khiển:

.state('nv.logout', { 
    url: '/logout', 
    resolve: { 
     logout: function ($grabhutAccountService) { 
      $grabhutAccountService.logoutUser(); 
     } 
    }, 
    controller: function ($scope, $state) { 
     $scope.$on('$stateChangeSuccess', function() { 
      $state.go('account.main');   
     }); 
    } 
}) 

Nhưng $stateChangeSuccess hiện không được kích hoạt.
Vì vậy, tôi cố gắng sử dụng rootScope:

.run(function(...., $grabhutAccountService){ 

    . 
    . 
    . 
    $rootScope.logout = function(){ 
     $grabhutAccountService.logoutUser(); 
    }; 
    . 
    . 
    . 

}) 

Và việc sử dụng nó như thế này:

<a ng-click="$root.logout()" class="button icon icon ion-log-out button-large" menu-close></a>

này hoạt động tốt. Nhưng tôi lo lắng vì (AFAIK) rootScope tải nhiều dữ liệu hơn có thể gây ra hoạt động chậm hơn.
Bên cạnh đó, bất cứ khi nào tôi cần một số chức năng như trên, tôi sẽ phải đính kèm chức năng trong rootScope một lần nữa.
Và tôi nghĩ đó không phải là cách tiếp cận tốt. BTW, tôi đang xây dựng điều này trong phonegap đó là lý do tại sao sử dụng bộ nhớ là rất quan trọng.

Trả lời

10

Ooooh bạn rất thân thiết. Tôi đã sắp xếp lại một số mã của bạn và đến đây:

app.run(function($rootScope, $grabhutAccountService) { 
    $rootScope.$on('$stateChangeSuccess', function (evt, toState) { 
    if (toState.name === 'nv.logout') { 
     $grabhutAccountService.logoutUser(); 
     $state.go('account.main'); 
    } 
    }); 
}); 

Phiên bản chính tiếp theo của giao diện người dùng-Router sẽ có nhiều cải tiến để thực hiện điều này.

Các vấn đề liên quan