router.navigate 更改 URL，但不呈现组件

问题描述

我愿意在我的模板中使用 <a href="/my-path/{{my_param}}"></a> ，而不是使用带有参数的函数将我重定向到一个页面.

所以，这就是我在 .ts 文件中构建函数的方式:

redirectToChat(my_param){this.router.navigate(['./my-path/' + my_param ]);}

以及我如何在模板中调用它:

 
...

它改变了 URL，但不渲染组件.我在我的组件中导入了这个:

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

我在构造函数中使用了它:private router: Router

你能帮我正确渲染组件吗?我还能如何使用函数将用户重定向到页面?

解决方案

您正在混合使用导航(到组件)和通过 url 导航.你试过navigateByUrl吗?

this.router.navigateByUrl('./my-path/' + my_param);

Instead of using <a href="/my-path/{{my_param}}"></a> in my template, I am willing to use a function with paramters to redirect me to a page.

So, this is how I built my function in my .ts file:

redirectToChat(my_param){
    this.router.navigate(['./my-path/' + my_param ]);
}

And how I called it in my template:

 <div (click)="redirectToChat(my_param)">
    ...
</div>

It changes the URL, but not rendering the component.I imported this in my component:

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

And I used it in my constructor: private router: Router

Can you help me to render corrctly the component? How else can I redirect the user to the page using a function?

解决方案

You are mixing navigate (to component) with navigate by url.Have you tried navigateByUrl?

this.router.navigateByUrl('./my-path/' + my_param);

这篇关于router.navigate 更改 URL，但不呈现组件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！