Mit ui-router
ist es möglich, entweder $state
oder $stateParams
in einen Controller zu injizieren , um Zugriff auf Parameter in der URL zu erhalten. Durch den Zugriff auf Parameter über werden jedoch $stateParams
nur Parameter verfügbar gemacht, die zu dem Status gehören, der von dem Controller verwaltet wird, der darauf zugreift, sowie zu den übergeordneten Status, während $state.params
alle Parameter vorhanden sind, einschließlich derjenigen in allen untergeordneten Status.
Wenn wir mit dem folgenden Code die URL direkt laden http://path/1/paramA/paramB
, geht das beim Laden der Controller folgendermaßen vor:
$stateProvider.state('a', {
url: 'path/:id/:anotherParam/',
controller: 'ACtrl',
});
$stateProvider.state('a.b', {
url: '/:yetAnotherParam',
controller: 'ABCtrl',
});
module.controller('ACtrl', function($stateParams, $state) {
$state.params; // has id, anotherParam, and yetAnotherParam
$stateParams; // has id and anotherParam
}
module.controller('ABCtrl', function($stateParams, $state) {
$state.params; // has id, anotherParam, and yetAnotherParam
$stateParams; // has id, anotherParam, and yetAnotherParam
}
Die Frage ist, warum der Unterschied? Und gibt es Best Practices-Richtlinien, wann und warum Sie diese verwenden sollten, oder vermeiden Sie die Verwendung einer dieser Richtlinien?
quelle
Antworten:
In der Dokumentation werden Ihre Ergebnisse hier wiederholt: https://github.com/angular-ui/ui-router/wiki/URL-Routing#stateparams-service
Wenn mein Gedächtnis dient,
$stateParams
wurde es später als das Original eingeführt$state.params
und scheint ein einfacher Hilfsinjektor zu sein, um ein kontinuierliches Schreiben zu vermeiden$state.params
.Ich bezweifle, dass es Best-Practice-Richtlinien gibt, aber der Kontext gewinnt für mich. Wenn Sie einfach auf die in der URL empfangenen Parameter zugreifen möchten, verwenden Sie
$stateParams
. Wenn Sie etwas Komplexeres über den Staat selbst wissen möchten, verwenden Sie$state
.quelle
$state.params
in verwendetACtrl
, weil ich überprüfen wollte, obyetAnotherParam
eingestellt ist. Wenn es nicht so ist, kann ich etwas tun. Ich gehe nicht auf die Details dieses Etwas ein, da es eine eigene Frage rechtfertigen könnte. Ich habe jedoch das Gefühl, dass ich einen Hack mache, indem ich nach einem Parameter suche, der von einem untergeordneten Status eingeführt und vom aktuellen Status nicht erkannt wird$stateParams
. Ich habe seitdem einen alternativen Ansatz gefunden.parent.child
, werden$stateParams
inparentController
URL-basierte Parameter von ausgewertetparent
, jedoch nicht die vonparent.child
. Siehe dieses Problem .$stateParams
funktioniert in Auflösung, während$state.params
es falsch ist (zeigt keine Parameter für Zustand, der noch nicht gelöst ist)Ein weiterer Grund für die Verwendung
$state.params
ist der nicht URL-basierte Status, der (meiner Meinung nach) völlig unterdokumentiert und sehr leistungsfähig ist.Ich habe dies gerade entdeckt, als ich darüber gegoogelt habe, wie man den Status übergibt, ohne ihn in der URL offenlegen zu müssen, und eine Frage an anderer Stelle auf SO beantwortet .
Grundsätzlich erlaubt es diese Art von Syntax:
quelle
EDIT: Diese Antwort ist für die Version korrekt
0.2.10
. Wie @Alexander Vasilyev betonte, funktioniert es in der Version nicht0.2.14
.Ein weiterer Grund für die Verwendung
$state.params
ist, wenn Sie Abfrageparameter wie folgt extrahieren müssen:quelle
Es gibt viele Unterschiede zwischen diesen beiden. Aber während ich praktisch arbeite, habe ich festgestellt, dass es
$state.params
besser ist. Wenn Sie immer mehr Parameter verwenden, kann die Verwaltung verwirrend sein$stateParams
. Wenn wir mehrere Parameter verwenden, die keine URL-Parameter sind,$state
ist dies sehr nützlichquelle
Ich habe einen Wurzelzustand, der etw auflöst. Die Übergabe
$state
als Auflösungsparameter garantiert nicht die Verfügbarkeit für$state.params
. Aber mit$stateParams
Willen.Unter Verwendung von "Angular": "~ 1.4.0", "Angular-UI-Router": "~ 0.2.15"
quelle
Eine interessante Beobachtung, die ich beim Übergeben früherer Statusparameter von einer Route zur anderen gemacht habe, ist, dass $ stateParams angehoben wird und die Statusparameter der vorherigen Route überschreibt, die mit den aktuellen Statusparametern übergeben wurden, bei Verwendung von
$state.param
s jedoch nicht.Bei Verwendung von
$stateParams
:Bei Verwendung von $ state.params:
quelle
Hier in diesem Artikel wird klar erklärt: Der
$state
Dienst bietet eine Reihe nützlicher Methoden zur Manipulation des Status sowie relevante Daten zum aktuellen Status. Auf die aktuellen$state
Statusparameter kann im Dienst über die Parametertaste zugegriffen werden. Der$stateParams
Dienst gibt dasselbe Objekt zurück. Daher ist der$stateParams
Dienst ausschließlich ein Komfortdienst, um schnell auf das params-Objekt im$state
Dienst zuzugreifen .Daher sollte kein Controller jemals sowohl den
$state
Dienst als auch seinen Komfortdienst einspeisen$stateParams
. Wenn das$state
nur injiziert wird, um auf die aktuellen Parameter zuzugreifen, sollte der Controller neu geschrieben werden, um$stateParams
stattdessen zu injizieren .quelle