In angular.js, how can I set the route using an anchor tag's href, but containing a query parameter too? I'm using html5Mode and it seems that the following:
ends up escaping the question mark before it sets the url.
I need to set the url exactly as is. How can I prevent it from escaping the question mark?
If you are using the default Angular router, the documentation says it all. Take a look at their example here.
If you are looking for a more robust router, I suggest you switch to ui-router.
Here's how you deal with query params, although you might just use URL parameters instead for pretty URLs.
With ui-router you don't have to use
href, you can pass query params to a route using ui-sref. Check out this example to see how.
Related
I am using this:
$state.go("/path/to");
I want to do this:
$state.go("/path/to?param=myParam");
But this is not working.
I have tried:
$location.path("/path/to?param=myParam");
$location.path("/path/to").search({param: "myParam"});
Both of them actually change the url but not updated the angularjs app - since this is not connected to the actual router.
How can I pass query string parameters using AngularJS ui router?
Note I know I can pass a full url path like this:
/path/to/param/myParam
But I need in this case that it will be query string params.
According to the documentation $state.go takes another parameter that you can use to pass query string.
$state.go("/path/to",{param:myParam});
Url config use like this
.state('path/:param', {
url: '/path/:param',
templateUrl: 'views/path.html',
})
you get value in controller use to $stateParams
I don't know why, but angularjs ui router is very tedious vs the regular ngroute made by Angular team. The reason I am using ui router is just because that it supports for lazyload of the view.
Anyway, this is the solution I was found - using $state.go and $location.path both:
$location.path(`/path/to`).search({param: "myParam}});
$state.go(`/path/to`);
This can be wrapped for easy use:
module.exports = (path, qsObj) => {
if (qsObj) {
$location.path(path).search(qsObj);
}
$state.go(path);
}
Take this route for exmaple
when('/coordinator/editApplications/:appId', {
templateUrl: 'assets/app/templates/coordinator/editApplications.tpl.html',
module: "/coordinator",
})
Without using regular expressions, is there a property/method available in Angular that will allow me to get the path value with the parameters stripped off?
The value I would want for this example would be /coordinator/editApplications
This needs to be be universal because there could be multiple params or differently named params. I can't find anyway on the $route or $location to get this value as they all seem to contain the params.
Again, I know i can use regExp to do this but I want to avoid that. I also don't want to just add another property to the route w/ the non-param url value.
I am hitting a REST endpoint at
www.example.com/resource/id
What is the best way for me to extract id from an angular module controller?
I have looked into using $routeProvider
$routeProvider.when('/resource/:id', {}).otherwise(...)
This will only work if I set
$locationProvider.html5mode(true)
If it is not set to true, it always ends up in the otherwise clause when I hit www.example.com/resource/8
How can I get this to work even if I don't set $locationProvider.html5mode to true?
I think you're looking for $route.current.params, I use angular-ui's ui-router ui-router, in which case you would use $stateParams.
use www.example.com#/resource/8 instead www.example.com/resource/8
just replace following code:
$routeProvider.when('/resource/:id', {}).otherwise(...)
with the:
$routeProvider.when('resource/:id', {}).otherwise(...)
/resource/:id ths take absolute url pattern. and resource/:id take relative url pattern.
so i think this will help you without setting of html mode true.
I'm trying to change the URL with AngularJS,
but not with a redirect, just change the URL
after an event.
What I need is this:
www.myurl.com/inbox/1 to this www.myurl.com/inbox/25
In other words, just change the last Id.
I'm trying to do this:
$location.path('/inbox/'+id);
But what I'm getting is this:
www.myurl.com/inbox/1#/inbox/25
Angular enforces the idea of one page web app. Browsers don't take any actions on change of anything after '#' value. So the best practice is to add variable attributes in url after '#' value which will keep the base url and attribute look clean on browser's address bar as well as solve your problem. My advice is to keep username, page no. , or any specific attribute id after '#' value.
In your case you should use something like above said
www.myUrl.com/#/inbox/25
or
www.myUrl.com/inbox/#/25
usually angular URLs look like
www.myurl.com/#/inbox/1
in which case
$location.url('/inbox/25');
should work for you
For that you should use .url() instead of .path()
$location.url(`/inbox/${id}`)
Is there any way to configure a different param for the current page number?
for example, I have this paginated url:
http://localhost/petproject/posts/index/page:2
And I would like to have the url like this:
http://localhost/petproject/posts/index/my_custom_page_param:2
Thank you!
You could simply use the router to transform the URL into something else that matches your needs by adding a rewrite rule for that URL. Without researching it further I think this is the most easy solution.
Another one might be to check in Controller::beforeFilter() if your custom named arg is set and copy/set it to params['named']['page'].
Or extend the Paginator component and create your customized version of it.