Frage

Betrachten Sie die folgende UI-Router-Konfiguration:

$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"
      }
    }
  })

Ich habe den folgenden Link in meiner App:

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

Ich versuche das zu bekommen feedId in Zustandsparametern:

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

Aber leider, $state.params ist immer {}.

Was mache ich falsch?

BONUS-FRAGE

ich erwarte FeedCtrl jedes Mal initialisiert werden, wenn ich auf den Link klicke, d. h.jedes Mal, wenn der Status geändert wird app.feed.Also, wenn ich dazwischen wechsle app.feed Bundesstaat und einen anderen Bundesstaat mehrmals, erwarte ich das console.log oben, um mehrmals ausgeführt zu werden.Aber es sieht so aus, als würde der UI-Router initialisiert FeedCtrl nur einmal.Warum?

War es hilfreich?

Lösung

Um einen Parameter zu übergeben, müssen wir ihn definieren:

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

In diesem Fall definieren wir es als {feedId}

Weitere Informationen finden Sie hier

Einige Beispiele:

  • '/user/{id:[^/]*}' - Gleich wie '/user/{id}' aus dem vorherigen Beispiel.
  • '/user/{id:[0-9a-fA-F]{1,8}}' – Ähnlich dem vorherigen Beispiel, stimmt jedoch nur überein, wenn der ID-Parameter aus 1 bis 8 Hexadezimalziffern besteht.
  • '/files/{path:.*}' – Entspricht jeder URL, die mit „/files/“ beginnt, und erfasst den Rest des Pfads im Parameter „path“.
  • '/files/*path' - Dito.Spezielle Syntax für Catch All.

Falls wir Parameter definiert haben, navigieren wir zwischen Zuständen mit unterschiedlichen Werten feedId Werte...Wir werden wirklich sehen, dass dieser Controller FeedCtrl wird wieder instanziert.So ist das ui-router wurde entworfen

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top