Die Statusparameter des UI-Routers können nicht abgerufen werden
-
21-12-2019 - |
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?
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