Reputation: 1424
I have a search feature on my application which searches a list of products, which is all going okay however I want to redirect the user to another page say www.site.com/search?keyword=perfume
I can only make it www.site.com/search/perfume
and www.site.com/search;keyword=perfume
Router navigate this.router.navigate(['search', {keyword: searchVal}]);
doing this results as www.site.com/search;keyword=perfume
Routes
const appRoutes: Routes = [
{ path: 'search', component: SearchComponent}
];
Search function:
findproduct(searchTerm: HTMLInputElement): void {
var searchVal = searchTerm.value;
this.productService.searchproduct(searchVal)
.subscribe(data => {
this.router.navigate(['search', {keyword: searchVal}]);
console.log(data)
});
}
How can I make my url to be www.site.com/search?keyword=perfume
Upvotes: 0
Views: 67
Reputation: 24894
You should use queryParams
:
this.router.navigate(['/search'], { queryParams: { keyword: searchVal } });
Upvotes: 2
Reputation: 159
You should update your appRoutes as follow:
const appRoutes: Routes = [
{ path: 'search/:keyword', component: SearchComponent}
];
Upvotes: 0