如何在 angular 项目中使用 category/subcategories/article slug 创建 SEO 友好的 URL？

Question

我正在使用 Angular 8 版本创建新闻应用程序。我需要像这样显示 link：www.domain.com/category/category/title 和 www.domain.com/category。我怎样才能做到这一点？

谢谢

Answer 1

您的字面意思是 link 的 link 文本与其 href like this 不同吗？

如果是，

<a [routerLink]="url">{{seoUrl}}</a>

打字稿：

url: 'https://www.google.com';
seoUrl: 'https://www.google.com/category/slug';

或者您想对页面本身的 url 做更多的事情？

编辑：

路由模块

// Declare two routes with an optional title. We will always redirect to the title route. Order matters here - routes will be matched in order.
{ path: 'category/:category/:title', component: CategoryComponent },
// this path declares a route similar to /category/abc where abc is a category 
{ path: 'category/:category', component: CategoryComponent }

类别组件

// component decorator omitted for brevity
export class CategoryComponent implements OnInit {
  constructor(private route: ActivatedRoute,
    private router: Router
  ) {
  }

  ngOnInit(): void {
    // get the category from the url
    const categoryName = this.route.snapshot.paramMap.get('category');
    const titleName = this.route.snapshot.paramMap.get('title');

    // TODO: implement categoryService
    this.categoryService.getCategory(categoryName).subscribe(category => {
      if (!title) {
        this.router.navigateByUrl(`/category/${category.name}/${category.title}`);
        return;
      }

      // TODO: render the category
    });
  }
}

如何在 angular 项目中使用 category/subcategories/article slug 创建 SEO 友好的 URL？

How to create SEO friendly URLs with category/subcategories/article slug in angular project?

slug

angular

angular8