How can I show an element only if there are certain queryParams added to the url?
e.g.
ngOnInit() {
this.route.queryParams.subscribe(params => {
console.log(params);
});
}
And I want to do something like:
<div *ngIf="queryParams = 'query_name'"></div>
You need to assign specific query param into a property and then use that property in the condition *ngIf.
queryParam;
ngOnInit() {
this.route.queryParams.subscribe(params => {
this.queryParam = params['yourParamName'];
});
}
In the markup
<div *ngIf="queryParam == 'yourCondition'"></div>
queryParam will be undefined and the condition will result falsein .ts file
private queryParams:string ='';
ngOnInit() {
this.route.queryParams.subscribe(params => {
this.queryParams= params['PARAMETER_NAME'];
});
}
**For "PARAMETER_NAME" you can mention the name of the query parameter. For example if route is "/userId"
this.queryParams= params['userId'];
in .html file
<div *ngIf="queryParams.toLowerCase() === 'QUERY_NAME'.toLowerCase()"></div>
**For "QUERY_NAME" you can mention the intended query parameter string. For example if intended string is "userName"
<div *ngIf="queryParams.toLowerCase() === 'userName'.toLowerCase()"></div>
