[英]Angular routes with params and getting params
A user will be clicking a link in an email like this:用户将单击电子邮件中的链接,如下所示:
do-something/doSomething?thing=XXXXXXXXXXX
How can I define the route in the router and subscribe to get params?如何在路由器中定义路由并订阅获取参数?
Currently in router I have:目前在路由器中我有:
{
path: 'do-something/:id',
component: DoSomethingComponent
},
In the component:在组件中:
ngOnInit() {
this.sub = this.route
.params
.subscribe(params => {
console.log(params)
});
}
However, the route never matches.但是,路线永远不会匹配。 Shouldn't ":id" consider anything after reset-password as a param? ":id" 在作为参数重置密码后不应该考虑任何事情吗?
this one i got for angular site这是我为角网站获得的
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
@Component({
template: `
<p>Dashboard</p>
<p>Session ID: {{ sessionId | async }}</p>
`
})
export class AdminDashboardComponent implements OnInit {
constructor(private route: ActivatedRoute) {}
ngOnInit() {
//read query param
this.route
.queryParamMap
.map(params => console.log(params.get('thing')););
//read param value
this.route
.paramMap
.map((params: ParamMap) =>
console.log(params.get('id')));
}
}
Read Routinh here : https://angular.io/guide/router#!#optional-route-parameters在这里阅读 Routinh: https ://angular.io/guide/router#!#optional-route-parameters
try like this像这样尝试
const appRoutes: Routes = [
{ path: 'do-something/:id', component: DoSomethingComponent, name: 'Details'}];
now navigation like现在导航像
this.router.navigate( [
'Details', { id: 'idvalue', param1: 'value1'
}]);//this you can try from code
this match这场比赛
do-something/idvalue?param1=value1. //this try from browser
read query param like this像这样读取查询参数
ngOnInit() {
// Capture the access token and code
this.route
.queryParams
.subscribe(params => {
let thing = params['thing'];
});
}
or try this或者试试这个
(new URL(location)).searchParams.get("parameter_name")
More than 1 hour wasted.浪费了1个多小时。
Both below did not work:以下两个都不起作用:
this.route.paramMap
& this.route.paramMap
&
this.route.params
Only below worked:只有以下有效:
this.route.queryParams
1.URL is like this: 1.网址是这样的:
http://localhost:4200/employee?tab=admin
2.Need to extract the value of query parameter tab
, which is admin
2.需要提取查询参数tab
的值,即admin
3.Code that worked is: 3.有效的代码是:
ngOnInit() {
this.route.queryParams.subscribe(params => {
console.error(" ==== ", params["tab"]); // this will print `admin`
// this.tabNameFromUrl = params["tab"];
});
}
Hope that helps.希望有帮助。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.