Question

我通常使用查询字符串来过滤结果，例如：

 URL:    /Events/List?type=art&city=miami&life=present

我可以按任何顺序放置它们并获得相同的结果，例如：

 URL:    /Events/List?city=miami&life=present&type=art
 URL:    /Events/List?life=present&type=art&city=miami

我也可以选择它们，例如：

 URL:    /Events/List?type=art, 
  or:    /Events/List?type=art&life=&city=

问题：如何使用Angular.js路由实现相同的“效果”？鉴于参数在Angular中以“RESTful”方式传递

我在考虑这样的事情：

 URL:   /Events/List/city/miami/life/present/type/art

我可以通过这样的路线实现这一目标：

 .when('/Events/List/city/:city?/life/:life?/type/:type?', { ... }

但我已经看到很多问题：

参数顺序很重要（我必须多次定义路线？）
可选参数将提供非直观的URL，
例如：/Events/List/city/life/type/art，

在可选的查询字符串中不是这种情况（我认为它们更直观易读）：例如：/Events/List/?city=&life=&type=art

Answer 1

如果你想使用查询字符串angular $location.search()，它既是setter又是getter。

角度search和窗口版本location.search之间的差异是查询落在网址哈希之后以及设置或获取它时使用对象而不是字符串

请参阅开发人员指南中的Using $location

Answer 2

您可以将$ routeParams注入控制器。以下是文档中的示例：

// Given:
// URL: http://server.com/index.html#/Chapter/1/Section/2?search=moby
// Route: /Chapter/:chapterId/Section/:sectionId
//
// Then
$routeParams ==> {chapterId:1, sectionId:2, search:'moby'}

http://docs.angularjs.org/api/ngRoute.$routeParams

Answer 3

我最近遇到了类似的需求（能够从路径中获取未知数量的参数），并且通过查看$ routeProvider开始了。我最终放弃了这项努力，转而支持ui.router。

对你来说，最强大（但可能也很乏味）的方法是使用regex parameters。请考虑以下内容（我目前正在创作的一些代码的片段）：

$stateProvider
    .state("list", {
        url: "/",
        controller: "PluginsListController",
        templateUrl: "PluginsList.html"
    })
    .state("path", {
        url: "/{plugin}/*path",
        controller: "PluginDetailsController",
        templateUrl: "PluginDetails.html"
    })
;

第二个州接受两个位置参数：plugin和path。 path参数是一个通配符，它在前一个斜杠之后抓取所有内容。这里的想法是我可以指定类似http://www.myfirsturl.com/app/MyFirstPlugin/level1/level2/level2.php的内容，最后使用＆＃34; MyFirstPlugin＆＃34;在$stateParams["plugin"]和＆＃34; level1 / level2 / level2.php＆＃34;在$stateParams["path"]。由应用程序逻辑来处理长路径参数（并且你同样负责使用这个可变长度的参数），但是这种方法允许你为一个未知数量的url写一个单独的状态处理程序路径。

Angular.js中的多个可选参数

3 个答案: