Angular ui-router 动态查询字符串定义 [英] Angular ui-router dynamic querystring definition

查看:24
本文介绍了Angular ui-router 动态查询字符串定义的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我们有一个搜索页面,我们有数千个可以由管理面板定义的搜索属性.一个典型的搜索结果页面有一个这样的网址:

We have a search page and we have thousands of search attributes that can define by an admin panel. A characteristic search result page has a url like that:

http://example.com/search?a12=3213&a314=412412&a247=1941829&....

当我们想使用 angular-ui-router 将该页面实现为 AngularJS 的 SPA 时,我无法理解,我们如何定义该路由配置以及如何读取所有搜索来自查询字符串的参数.因为 ui-router 强制在路由配置中定义每个查询参数的可能性,以便在 $stateParams 中使用它们.

When we want to implement that page as a SPA with AngularJS by using angular-ui-router, I couldn't understand, how can we define that route configuration and how can we read all search parameters from querystring. Because ui-router forces to define every queryparam possibilities on route configuration to use them in $stateParams.

$stateProvider.state('search', {
    url: '/search?a1&a2&a3&a4&a5' // what about a1314?
    controller: function ($stateParams) {
        console.log($stateParams.a1314);
    }
});

您知道解决方法吗?

推荐答案

你可以在 url: '/search' 搜索路径的 controller 中使用 $location.search()

you can use $location.search() in url: '/search' search route's controller

在不带任何参数的情况下调用时返回当前 url 的搜索部分(作为对象).

it return search part (as object) of current url when called without any parameter.

var searchObject = $location.search();

// => {a12: '3213', a314: '412412'}

console.log(searchObject .a12); //3213

对于路线你可以使用

 url: '/search*' 

所以它会匹配

这篇关于Angular ui-router 动态查询字符串定义的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆