SAP Spartacus的自定义路由

原创

Jerry Wang

修改于 2020-11-23 11:29:34

6410

修改于 2020-11-23 11:29:34

我新建了一个自定义Component：

import { Component, OnInit } from '@angular/core';
import { ProductNameNormalizer } from './product-name-normalizer';

@Component({
  selector: 'app-custom-page',
  templateUrl: './custom-page.component.html',
  styleUrls: ['./custom-page.component.scss']
})
export class CustomPageComponent implements OnInit {

  constructor(private productNameNormalizer: ProductNameNormalizer) {
  }

  ngOnInit(): void {
  }

}

HTML页面代码：

<p>custom-page works!</p>

<a href="/cameras/photosmart-e317-digital-camera/300938">Awesome Product</a>

<p></p>
<a [routerLink]="{ cxRoute: 'product', params: {code: '300938',
nameForUrl: 'Jerry' }} | cxUrl">Awesome Product 2</a>

新建一个module，在里面自定义路由逻辑：

const CUSTOM_ROUTES: Routes = [
  { path: 'custom', component: CustomPageComponent, canActivate: [CmsPageGuard] },
  { path: 'contact1', component: CustomPageComponent },
  {
    path: 'faq-alias', component: PageLayoutComponent, canActivate: [CmsPageGuard],
    data: {
      pageLabel: 'faq'
    }
  }
];

语义：

url里输入custom时，打开Component CustomPageComponent，启用PageGuard

url里输入contact1时，打开Component CustomPageComponent，不启用PageGuard

url里输入faq-alias时，打开PageLayoutComponent，使用的CMS page id为faq.