Question

Considérez la configuration ui-routeur suivante :

$stateProvider
  .state('app', {
    url: "/app",
    abstract: true,
    templateUrl: "templates/menu.html",
    controller: 'AppCtrl'
  })
  .state('app.feed', {
    url: "/feed",
    views: {
      'menuContent': {
        templateUrl: "templates/feed.html",
        controller: "FeedCtrl"
      }
    }
  })

J'ai le lien suivant dans mon application :

<a ui-sref="app.feed({ feedId: 5 })">My Link</a>

J'essaie d'obtenir le feedId dans les paramètres d'état :

angular.module('MyApp').controller('FeedCtrl', function($state) {
  console.log($state.params);
});

Mais malheureusement, $state.params est toujours {}.

Qu'est-ce que je fais mal?

QUESTION BONUS

Je m'attends à FeedCtrl à initialiser à chaque fois que je clique sur le lien, c'est-à-direchaque fois que l'état est changé en app.feed.Donc, si je change entre app.feed état et un autre état plusieurs fois, je m'attends à ce que le console.log ci-dessus pour exécuter plusieurs fois.Mais il semble que l'interface utilisateur-routeur s'initialise FeedCtrl juste une fois.Pourquoi?

Était-ce utile?

La solution

Pour passer un paramètre, nous devons le définir :

 .state('app.feed', {
    url: "/feed/{feedId}",
    views: {
      'menuContent': {
        templateUrl: "templates/feed.html",
        controller: "FeedCtrl"
      }
    }

Dans ce cas, nous le définissons comme {feedId}

En voir plus ici

Quelques exemples:

  • '/user/{id:[^/]*}' - Pareil que '/user/{id}' de l'exemple précédent.
  • '/user/{id:[0-9a-fA-F]{1,8}}' - Similaire à l'exemple précédent, mais ne correspond que si le paramètre id est composé de 1 à 8 chiffres hexadécimaux.
  • '/files/{path:.*}' - Correspond à n'importe quelle URL commençant par « /files/ » et capture le reste du chemin dans le paramètre « chemin ».
  • '/files/*path' - Idem.Syntaxe spéciale pour fourre-tout.

Dans le cas où nous avons défini des paramètres, nous naviguerons entre les états avec différents feedId valeurs...on verra vraiment, que ce contrôleur FeedCtrl est réinstancié.C'est ainsi que le ui-router a été conçu

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top