On button click I am redirecting to another page using state.go(). the code is
$scope.usercal = function(x,y,z){
$state.go('app.calendar',{employeeName:x,employeeID:y,projectName:z});
}
I want to do the same with `$location.path(/url);
But how to pass the parameters?
hi to pass Parameters for $location.path you should use $location.search() like this:
$location.path('/myURL/').search({param: 'value'});
This will lead to
/myURL/?param=value
If your parameters are the part of url (path) only than you can use
$location.path('/myURL/'+x+'/'+y);
if parameter is query string then go with
$location.path('/myURL/').search({employeeName: x});
We use ngRoute, which operates slightly differently than ui-router.
$stateParams in ui-router is converted to $routeParams, which can contain values in the same way, and is populated using url's as usual like so:
some/path/:a/to/dir/:b results in the params to the resulting page be {a, b}.
Related
I am working on ui-router. I have a state:
.state('new-personal-orders', {
url: '/orders/new-personal-orders/:catId?',
template: '<new-personal-orders></new-personal-orders>'
})
In my controller i can make the state call with the
$state.go('new-personal-orders',null,{reload:true})
In the Html File i have an anchor tag:
Link
If the tag is clicked the state changes and 'new-personal-orders' turns into the current state with the trailing hash in the url. The url then looks like:
http://localhost:3000/orders/new-personal-orders#12
I want to do the same from the controller file with the $state.go() function of ui-router. But the hash url is not added.
My question is that is there any way that the hash url can be passed by the $state.go() in ui-router?
It seems that you can now put a hash in the state params like so:
$state.go('new-personal-orders', {'#': catId });
And you don't even need a /:catId in the state configuration at all.
See https://github.com/angular-ui/ui-router/pull/1867
You can pass state params as an argument in $state.go :
$state.go('new-personal-orders', {catId: 12}, {reload:true})
// refers to: http://localhost:3000/orders/new-personal-orders/#12
It seems that you are attempting to implement the same inside an ng-repeat, then you should replace 12 by something such as order.catId etc.
I want to search on my page. Actually, my code is
$stateProvider
.state('aaa', {
url: '/aaa',
templateUrl: 'client/parties/views/aaa.ng.html',
controller: 'Aaa'
})
$urlRouterProvider.otherwise("/default");
And now, I want to search on my page, but the params MUST working with the URL.
How to use params when I have $urlRouterProvider.otherwise?
Actually, everything after /aaa/ in URL causes redirect to /default.
Important thing: I have more than 20 parameters, but when there're not selected, I don't want to pass it via URL. This is important because I think I can't do something like url: '/details/:param1:param2:param3:param4',
Can you help me?
Looking at the documentation for ui-router, it doesn't seem like it is possible to not have it redirect without having at least one parameter defined on the state's route.
To accomplish what you want, I think the best is to use a catch all parameter of some sort. It's either that, restricting deep-linking, or reducing the amount of parameters and manually defining it.
Define a catch all parameter as shown below. In this case the parameter is path redirects will not take place if there is nothing after "/files/":
'/files/{path:.*}' - Matches any URL starting with '/files/' and captures the rest of the path into the parameter 'path'.
'/files/*path' - Ditto. Special syntax for catch all.
Define one parameter on a new route, and then split the one parameter into multiple parameters in the controller.
I'm trying to update a url without refreshing my page and i'm working with this solution: https://github.com/angular/angular.js/issues/1699#issuecomment-45048054
I notice that this code works:
$route.current.pathParams.program = "someValue";
$location.path('/myapp/' + $routeParams.program);
But this code does NOT work:
$routeParams.program = "someValue";
$location.path('/myapp/' + $routeParams.program);
I'm wondering what the difference is and why one works but not the other?
It doesn't work because AngularJS does not recognize any changes to $routeParams until after the route changes, per the documentation
Note that the $routeParams are only updated after a route change
completes successfully. This means that you cannot rely on
$routeParams being correct in route resolve functions. Instead you can
use $route.current.params to access the new route's parameters.
need direct access to an object that can reveal information about the query parameter passed.
Would prefer a way to get hold of an object just like you could do with injector for an $http object
var $http = angular.injector(["ng"]).get("$http");
what's the most direct/short/concise/eloquent way to get the query variables without going through a controller.
Alternatively other options please.
Here is an Example to get query parameter
In app.js for example
.when('/catagory/:catagoryid/:catagoryname',
{
templateUrl:'partials/bookOfParticularCatagory.html',
controller:'bookOfParticularCatagoryController'
})
In controller
app.controller("bookOfParticularCatagoryController",function($routeParams,$scope,$http){
$scope.catagoryid= $routeParams.catagoryid;
$scope.catagoryname= $routeParams.catagoryname;
Having really big JSON object in Angular controller and ui-sref link I want to pass this object to controller of template that would be in ui-view.
I know, that I can pass parameters to state with ui-sref, but I don't want this object to appear in address bar. Also, I know that we can use 'resolve' option in state, but I can't find how to pass data to 'resolve' function from link.
Update
If I use $state.go like that:
router configuration
state('social.feed.detailed',
url: '/:activityID'
templateUrl: 'views/social/detailedactivity.html'
)
in template
<ums-social-activity ng-repeat="record in SOC_FEED_CTRL.records"
activity="record"
ui-sref-active="selected"
ng-click="SOC_FEED_CTRL.goToDetailed(record)">
</ums-social-activity>
in controller
$scope.SOC_FEED_CTRL.goToDetailed = (activity) ->
# here activity is real object
$state.go('social.feed.detailed', {'activityID':activity.id, 'activity':activity})
Then 'activity' param doesn't resolves at all.
Update 2
If I modify route configuration to this:
state('social.feed.detailed',
url: '/:activityID?activity'
templateUrl: 'views/social/detailedactivity.html'
)
Then activity is string "[object Object]"
You can use the ui-router module's $state.go function call to manually pass in $stateParams that won't appear in the URL. So, rather than using the ui-sref attribute, you'd set an ng-click handler that calls $state.go(STATE,{'param':JSON}).
Then, inject $stateParams into your controller, and read
$stateParams.param
To get your JSON object back.
Chances are
ui-sref-active="selected"
Selected represents an object
selected.name
or
selected.id
Selected looks like it represents a key value relationship. That is what I am experiencing anyway.
<a ui-sref="itinerary.name({name:person.id})">