导航到新的URL [英] Navigate to a new URL

问题描述

这是我的 127.0.0.1:8000/app/admin 页面的一小部分:当我单击切换到更新模式"按钮时，函数 update()被执行，并显示足球比赛列表.当我从该列表中单击一个匹配项时，网页的内容会更改，但URL保持不变: app/admin .

This is a small part of my 127.0.0.1:8000/app/admin page: When I click on switch to update mode button, function update() gets executed, and it displays a list of football matches. When I click on a match from this list the content of the web page changes but the url remains the same : app/admin.

要更改url参数，请添加我单击的匹配项的ID，如下所示:

To change the url params, I add the id of the match I clicked on as follows:

 update(id) {
    this.router.navigate(['admin'], { queryParams: { id: id } });
    // code ...
}

现在，当我从列表中单击一个匹配项时，该网址将更新为 127.0.0.1:8000/app/admin?id=match_id ，但是当我尝试从我的网站访问此网址时我直接浏览器访问 app/admin 内容，所以我无法直接访问 127.0.0.1:8000/app/admin?id=match_id

Now when I click on a match from the list, the url gets updated to 127.0.0.1:8000/app/admin?id=match_id , But when I try to access this url from my browser directly I land on app/admin content so I'm incapable of accessing 127.0.0.1:8000/app/admin?id=match_id directly

推荐答案

您是否尝试过在ngOnInit中订阅路由参数并对其进行检查?像下面一样

Have you tried subscribing to the route params in ngOnInit and inspecting them? Like below

在demo.component.ts

In demo.component.ts

export class DemoComponent implements OnInit, OnDestroy {

 matchId: string;

 constructor(private route: ActivatedRoute, private router: Router) {        
  }

  ngOnInit() {
    this.route.params.subscribe( params => {
      this.matchId = params.matchId;
    });
    /* Other stuff*/
    //check this.matchId and process accordingly
  }

  ngAfterViewInit(){
    //check this.matchId and process accordingly
  }
 }

并且在app-routing.module.ts

And In app-routing.module.ts

 { path : 'admin/:matchId', component: DemoComponent },

这篇关于导航到新的URL的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！