代码之家 › 专栏 › 技术社区 › Orange Lux

Angular2路由器:匹配任何url,包括子目录

seo routing angular

Orange Lux · 技术社区 · 7 年前

到目前为止,我必须创建一个主页、一个productPage和一个errorPage。

产品页面的“旧”链接如下所示: /category/subcategory/some/eventual/other/things/productName-id.html

Matan Shukry's Complex Url Matcher ,这是我当前的代码:

import { ComplexUrlMatcher } from '../../functions/complex.url.matcher';

const appRoutes: Routes = [
    {
        path:      '',
        component: HomepageComponent,
    },
    {
        matcher:   ComplexUrlMatcher('product', /.*/), // very permissive regex here, in order to test
        component: ProductComponent,
    },
    {
        path:      '**',
        component: Error404Component,
    },
];

/abcdefg.html 工作(加载ProductComponent)
/a/b/c/d/e/f/g.html 不(加载Error404组件)
/a/bcdefg.html 也不是

2 回复 | 直到 7 年前

Sheik Althaf 7 年前

最好一起去 parameters 在angular中,您可以定义管线的参数

{ path: 'hero/:a/:b/:c/:d/:e/:f/:g', component: HeroDetailComponent },
{ path: 'hero/:a/:b/:c/:d/:e/:f', component: HeroDetailComponent },
{ path: 'hero/:a/:b/:c/:d/:e', component: HeroDetailComponent },
{ path: 'hero/:a/:b/:c/:d', component: HeroDetailComponent },
{ path: 'hero/:a/:b/:c', component: HeroDetailComponent },
{ path: 'hero/:a/:b', component: HeroDetailComponent },
{ path: 'hero/:a', component: HeroDetailComponent },
{ path: 'hero', component: HeroDetailComponent },

HeroDetailComponent 

import { ActivatedRoute } from '@angular/router';

constructor(
    private route: ActivatedRoute
) { }

this.route.paramMap.subscribe(params => {
  console.log(params);
});

您将获得订阅中的所有参数并执行操作

id 是一个参数。同样,您可以向路由传递多个参数创建路线结构

https://angular.io/guide/router#route-parameters-required-or-optional 点击此链接了解更多详细信息

Orange Lux 7 年前

anein's function

以下是我的要点: https://gist.github.com/MarcBrillault/87f8df9610cfa3ed112afc3f8da474e8

编辑:gist已更新。

推荐文章

Present practice · Angular5如何防止url更改时重新加载页面

7 年前

Rakesh Roy · 如何知道角5及以上的路由器出口中加载了哪个组件

7 年前

Bham · Symfony通过yaml路由名称

7 年前

Abhinav Jha · 如何在jquery帖子的回调中重定向

7 年前

Nagaraja SV · 如何在golang中使用julienschmidt/httprouter传递两个或多个参数?

7 年前

Burst of Ice · 成功身份验证后角度路由不工作

7 年前

RyanIndustries8 · 阵列角度布线5

7 年前

Andrei · 有没有办法通过本机或库向Android VPN添加自定义路由规则?

7 年前

mike · 从预定功能路由烧瓶

7 年前

David Lee · 在开发期间使用localhost创建到子域的HREF

7 年前