Page 360 - AngularJS权威教程

340 第 25 章 AngularJS 精华扩展

功能，它通过状态导航应用，而不是简单地通过URL导航。
这个选项类似于ngRoute的URL，但你可以把它当作ngRoute的升级版，稍后可以看到更多
信息。

基本路由可以像这样指定：

$stateProvider
.state('inbox', {
url: '/inbox',
template: '<h1>Welcome to your inbox</h1>'
});
当用户导航到/inbox时，应用会转换到inbox状态，然后使用模板内容（<h1>Welcome to your
inbox</h1>）填充主要的ui-view指令。
URL可以接受一系列不同的选项，它还可以在url中设置基本的参数，就像在ngRoute中一样：

$stateProvider
.state('inbox', {
url: '/inbox/:inboxId',
template: '<h1>Welcome to your inbox</h1>',
controller: function($scope, $stateParams) {
$scope.inboxId = $stateParams.inboxId;
}
});
应用会捕获作为URL第二个组成部分的:inboxId。例如，如果用户转换到/inbox/1，
$stateParams.inboxId就会变成1（因为$stateParams为{inboxId: 1}）。
如果你喜欢，还可以使用不同的语法：

url: '/inbox/{inboxId}'
这里路径必须与URL精确匹配。和ngRoute不同，如果用户导航到/inbox/，上面的路径能
够正常工作。但是，当导航导到/inbox时，上述示例配置中的状态不会被激活。

此外，你还可以在路径参数内使用正则表达式，因此你可以设置一个匹配路由的规则。
例如：
// 只匹配包含6个十六进制数字的inbox ID
url: '/inbox/{inboxId: [0-9a-fA-f]{6}}',
// 或者匹配每个URL中`/inbox`后面的`inboxId`（全部捕获）
url: '/inbox/{inboxId:.*} '

注意，不能在路由内使用正则捕获组，因为路由解析器将无法解析这个路由。
甚至还可以在路由中指定查询参数：

// 匹配诸如/inbox?sort=ascending形式的路由
url: '/inbox?sort'

5. 嵌套路由
你可以使用url参数以插入路由的方式提供嵌套路由。这让你可以在页面或者模板内有多个
ui-views。例如，你可以在上面的/inbox路由内嵌套独立的路由。