按钮路由器 link 不工作 angular

Question

我想弄清楚如何在按钮中提供 routerLink 路径。如果我提供完整路径，则下面的路由器代码可以正常工作，我可以看到该页面。

[routerLink]="['/home',{outlets:{homeOutlet:':product/import/103'}}]"

但是我有变量而不是任务和 id，我尝试了以下但没有用。

[routerLink]="['/home', {outlets:{homeOutlet:':(this.productStore.activeProduct$.getValue().productName)/import/this.productStore.activeProduct$.getValue().id'}}]">

我该如何解决这个问题？请指教

Answer 1

如果你把它移到打字稿代码中，这可能会起作用

  import { Router,ActivatedRoute } from "@angular/router";

  constructor(private router:Router){}

    public navigate() {
       string path = ':' +this.productStore.activeProduct$.getValue().productName +'/import/' + this.productStore.activeProduct$.getValue().id
       this.router.navigate(['/home', { outlets: { homeOutlet: [path] } }]);
    }

然后在您的 html 文件中删除属性 [routerLink] 并添加 (click) = "navigate()"

按钮路由器 link 不工作 angular

Button Router link is not working angular

router-outlet

angular