web-dev-qa-db-fra.com

AngularJS transition à l'état abstrait

Je travaille sur une application construite avec AngularJS qui a deux états différents:

  1. Assistant d'intro de l'application
  2. Pages d'applications (avec un modèle de navigation et des vues imbriquées)

Je souhaite passer par défaut à l'état 1 la première fois que quelqu'un accède à l'application, une fois que vous avez terminé l'assistant, passez aux pages de l'application, état 2.

Mon état "app" (État 2) est un état abstrait car il comporte des vues imbriquées. Donc, je ne peux pas passer à cet état.

.config(function($stateProvider, $urlRouterProvider) {
$stateProvider

  .state('intro', {
    url: '/',
    templateUrl: 'templates/intro.html',
    controller: 'IntroCtrl'
  })

  .state('app', {
    url: '/app',
    abstract: true,
    templateUrl: 'templates/menu.html',
    controller: 'AppCtrl'
  })

  .state('app.playlists', {
    url: "/playlists",
    views: {
      'menuContent' :{
        templateUrl: "templates/playlists.html",
        controller: 'PlaylistsCtrl'
      }
    }
  });

  $urlRouterProvider.otherwise("/");

})
angularjsangular-uiionic-framework
11
Mark Kamyszek

J'ai le même problème avec vous, voici un autre article sur l'état abstrait: angularjs état enfant par défaut d'u-routeur et ui-sref

Cela explique clairement pourquoi vous n'êtes pas en mesure d'accéder directement à l'état abstrait

Il est un peu tard pour répondre à ce message, mais espérons que cela vous aidera.

(Btw, cela devrait être un commentaire)

13
Neaped

J'ai ajouté le service $ location au contrôleur de la page "intro" et utilise ce qui suit pour passer à l'état de l'application qui fonctionne pour moi.

$location.path('app/playlists');

Le menu.html est chargé et navigue vers les listes de lecture.

3
Yang Zhang

Dans un service:

$location.path(
    $state.href('app.some.abstract.state', { some: 'params' })
);

Ou dans un modèle ($state doit être disponible dans le $scope local ou global):

<a ng-href="{{$state.href('app.some.abstract.state', { some: 'params' })}}">...</a>
0
Zane Hooper