it-swarm.com.ru

как вернуть $ state.current.name из смены состояний ui-router

Я хотел бы вернуть .state('name'), когда я меняю местоположение в угловых.

Из моего run() он может вернуть объект $state:

 .run(function($rootScope, Analytics, $location, $stateParams, $state) {
      console.log($state);

working object

но когда я пытаюсь получить $state.current, это пустой объект

.run(function($rootScope, $location, $stateParams, $state) {

      console.log($state.current);

empty

пример конфигурации:

 .config(function($stateProvider, $urlRouterProvider, AnalyticsProvider) {  
        $urlRouterProvider.otherwise('/');
        $stateProvider
        .state('home', {
            url: '/',
            views: {
              '': {
                templateUrl: 'views/main.html',
                controller: 'MainCtrl'
              },
              '[email protected]': {
                templateUrl: 'views/partials/navigation.html',
                controller: 'NavigationCtrl'
              },
              '[email protected]': {
                templateUrl: 'views/partials/weekly.html',
                controller: 'WeeklyCtrl'
              },
              '[email protected]': {
                templateUrl: 'views/partials/side-panel.html',
                controller: 'SidePanelCtrl'
              },
              '[email protected]': {
                templateUrl: 'views/partials/shop-panel.html',
                controller: 'ShopPanelCtrl'
              },
              '[email protected]': {
                templateUrl: 'views/partials/footer.html',
                controller: 'FooterCtrl'
              }
            }
          })
33
Matthew Harwood

Вы можете прослушивать '$ stateChangeSuccess' и устанавливать состояние согласованно. Например -

$rootScope.$on('$stateChangeSuccess',
  function(event, toState, toParams, fromState, fromParams) {
    $state.current = toState;
  }
)
26
Sandeep Shabd

В качестве альтернативы решению Sandeep вы также можете сделать это следующим образом:

angular.module('yourApp').run(['$rootScope', '$state',
    function ($rootScope, $state) {
        $rootScope.$state = $state;
    }
]);

Делая это таким образом, он устанавливается только один раз вместо oneverystateChange. По сути, вы просто храните ссылку на $ state где-то - я выбрал $ rootScope, чтобы этот пример был простым.

Теперь в моем коде я могу легко ссылаться на это как:

<div ng-show="$state.includes('accounting.dashboard')"></div>

а также

<div>Current State: {{$state.current.name}}</div>

Я также обычно храню $ stateParams, так что у меня есть еще больше информации о состоянии (но я оставил это вне этого примера).

10
PRB

Вы также можете попробовать.

.controller('yourApp', function($scope,$state) {
  $scope.state = $state;

Теперь вы можете войти в свою консоль.

console.log($state);

Он должен вернуть текущее состояние, в котором вы находитесь.

Или вы можете вызвать область в вашем html-представлении следующим образом.

{{state.current.name}}

Он также вернет состояние, в котором вы находитесь.

1
Kudos

Если вы хотите управлять своим состоянием в контроллере, то вы должны поддерживать это так:

console.log($state.current.name);

И если вы хотите утешить это в представлениях, то:

В контроллере:

$scope.state = $state.current.name;

В шаблоне: печатать так

{{state}}
0
Kumar Rakesh