We have a search page and we have thousands of search attributes that can define by an admin panel. A characteristic search result page has a url like that:
http://example.com/search?a12=3213&a314=412412&a247=1941829&....
When we want to implement that page as a SPA with AngularJS by using angular-ui-router
, I couldn't understand, how can we define that route configuration and how can we read all search parameters from querystring. Because ui-router
forces to define every queryparam possibilities on route configuration to use them in $stateParams
.
$stateProvider.state('search', {
url: '/search?a1&a2&a3&a4&a5' // what about a1314?
controller: function ($stateParams) {
console.log($stateParams.a1314);
}
});
Do you know a workaround?
Query parameters are used to pass optional params to the Angular route.
Angular UI-Router is a client-side Single Page Application routing framework for AngularJS. Routing frameworks for SPAs update the browser's URL as the user navigates through the app.
import ActivatedRoute from '@angular/router'. Inject ActivatedRoute class in constructor. Access queryParams property of ActivatedRoute class which returns an observable of the query parameters that are available in the current URL route.
you can use $location.search() in url: '/search'
search route's controller
it return search part (as object) of current url when called without any parameter.
var searchObject = $location.search();
// => {a12: '3213', a314: '412412'}
console.log(searchObject .a12); //3213
and for route you can use
url: '/search*'
so it will match
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With