UI的路由器仅与特定值的路由 [英] ui-router for routes with ONLY SPECIFIC values

问题描述

我试图建立多个唯一目标网页的结构如下

I'm trying to build a route for multiple unique landing pages with the following structure

domain.com/:state/:city/:category

我如何定义路由，使国家，城市和类别只能是predefined值之一，又名：

How can I define the route so that the state, city, and category can be only one of predefined values, aka:

状态= / CA |马| AK | AZ | AR ... / I
城市= /los-angeles|san-francisco|.../i
类别= /画|管道| ... / I

这些列表这么长有一个巨大的正则表达式并没有太大的意义（或不是吗？）

These lists are long so having a huge regex doesn't make much sense (or does it?)

我会使用规则（）？ $ urlMatcherFactory ？我怎么可以用一个函数？

Would I use a rule() ? $urlMatcherFactory? how can I use a function?

任何帮助是AP preciated。在此先感谢

any help is appreciated. Thanks in advance

推荐答案

去这里的方法是使用自定义的类型即可。

The way to go here, is with custom type.

在本 Q＆安培显示;一个，在情况下，我们想新建某种类型的这是准备过程值真正 假 1 0 为布尔，我们可以将其定义是这样的（还有的也正在plunker ）：

As shown in this Q & A, in case we wan to create some type which is ready to process values true, false, 1, 0 as boolean, we can define it like this (there is also working plunker):

app.config(['$urlMatcherFactoryProvider', function($urlMatcherFactory) {

  $urlMatcherFactory.type('boolean',
    // our type custom type
    {
     name : 'boolean',
     decode: function(val) { return val == true ? true : val == "true" ? true : false },
     encode: function(val) { return val ? 1 : 0; },
     equals: function(a, b) { return this.is(a) && a === b; },
     is: function(val) { return [true,false,0,1].indexOf(val) >= 0 },
     pattern: /bool|true|0|1/
    })

}]);

用同样的方法，我们可以定义我们的类型

The same way we can define our types

$urlMatcherFactory.type('state'   , ...
$urlMatcherFactory.type('city'    , ...
$urlMatcherFactory.type('category', ...

和以后我们可以将它们用于状态defintions任意数量的：

And later we can use them for any amount of state defintions:

...
.state('mystate', {
    url: 'xxx/{state:state}/{city:city/{category:category}
    ...

这是所有可能的工作，因为我们能为的 UrlMatcher 这样

That all could work because we can define url for UrlMatcher like this

'{'名'：'正则表达式|类型'} - 卷曲的占位符正则表达式或类型名。如果正则表达式本身包含大括号，它们必须是成对或用反斜杠转义。

'{' name ':' regexp|type '}' - curly placeholder with regexp or type name. Should the regexp itself contain curly braces, they must be in matched pairs or escaped with a backslash.

所以，不仅正则表达式 - 而且在 键入 - 包括我们自定义的

So, not only regexp - but also the type - including our custom one

这篇关于UI的路由器仅与特定值的路由的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！