带参数的Angular routerLink正在更改网址，但不会导航或重新加载

Question

它会更改url，但不会重新加载。

我基本上是试图重新加载页面，但有一个不同的数据。

post.component.ts

constructor(private postService :PostService, private activateRoute: ActivatedRoute)
  
    {}

private getPostsbyCategory(){
          this.postService.getPostsByCategory(this.catid).subscribe((data:PostModel[]) => {
            this.postbycategory = data;
            console.log(data)
          }, error => {
            throwError(error);}
            // 
          );}


 ngOnInit() {

    this.id = this.activateRoute.snapshot.params.id;
    this.catid = this.activateRoute.snapshot.params.catid;

    console.log(this.id);
    console.log(this.catid)
    this.getposts();
    this.getPostsbyCategory();

post.component.html

 <a routerLink="/view-post/{{post.catid}}/{{post.id}}" class="card">

下面是路由文件app-routing.module.ts

 import { NgModule,Component } from '@angular/core';
    import { RouterModule, Routes } from '@angular/router';
    import { ReactiveFormsModule } from '@angular/forms';
    import { FormsModule } from '@angular/forms';
    import { TestComponent } from './test/test.component';
    
    import { HomeComponent } from './home/home.component';


    import { ViewPostComponent } from './component/post/view-post/view-post.component';
    import { ViewCategoryComponent } from './component/category/view-category/view-category.component';
    const routes: Routes = [
    
      { path: '', component: HomeComponent },
      {path: 'home', component: HomeComponent },
      {path: 'test', component: TestComponent },
      {path: 'topics', component: ListTopicsComponent },
      { path: 'view-topics/:id', component: ViewTopicsComponent },
      {path : 'view-post/:catid/:id', component:ViewPostComponent}, 
    
    ];
    
    @NgModule({
      imports: [RouterModule.forRoot(routes , {onSameUrlNavigation: 'reload'})],
      exports: [RouterModule]
    })
    export class AppRoutingModule { }

它改变了网址，但没有重新加载，我基本上是试图重新加载页面，但有一个不同的数据。

Answer 1

尝试将链接放在一组方括号中，并将链接本身放在单引号中。

 <a routerLink="['/view-post/{{post.catid}}/{{post.id}}']" class="card">