如何使用ui-router为AngularJS提取查询参数？

如何使用ui-router为AngularJS提取查询参数？

在AngularJS自己的$location服务中，我做了：

（$ location.search（））。UID

从URL中提取参数uid。 ui-router的相应代码是什么？

Answer 1

除非你绑定到查询参数（请参阅文档），否则不要直接通过$state或$stateParams来访问它们。 使用$location服务。

编辑：每个文档 ，如果你想捕获$stateParams查询参数，你可以追加一个? 到你的url ，并命名每个查询参数，用&隔开，即url: "/foo?bar&baz" 。

Answer 2

请参阅URL路由文档的查询参数部分。

您也可以在“？”后面指定参数作为查询参数：

 url: "/contacts?myParam" // will match to url of "/contacts?myParam=value" 

对于这个例子，如果url是/contacts?myParam=value那么$state.params的值将是：

 { myParam: 'value' } 

Answer 3

ui-router不区分$ location服务中的不同types的参数。

在您的控制器中，您可以使用$ stateParams服务来访问您url中所有不同types的参数。

下面是ui-router wiki的一个例子：

 // Then you navigated your browser to: '/users/123/details/default/0?from=there&to=here' // Your $stateParams object would be { id:'123', type:'default', repeat:'0', from:'there', to:'here' } 

所以在你的情况下，finduid参数只需使用：

 $scope.uid = $stateParams.uid 

Answer 4

你还需要在$ stateProvider中定义查询参数

 state('new-qs', { url: '/new?portfolioId&param1&param2', templateUrl: 'new.html', controller: function($scope, $stateParams) { $scope.portfolioId = $stateParams.portfolioId; $scope.param1 = $stateParams.param1; $scope.param2 = $stateParams.param2; } }) 

由benfoster.io解释

Answer 5

你可以从$ stateParams得到它，但是在这种情况下，你也必须在路由中声明查询variables。

在路由中声明像 –

 url: '/path?name' 

为获取控制器中的名字注入$ stateParams，并使用像 –

$stateParams.name