When user arrive to following URL
mainurl/exampleurl?token=23
i can extract the "exampleurl" using this $state.$current.name
How can i exctract the token=23 from this url
You can get parameters from $stateParams:
https://github.com/angular-ui/ui-router/wiki/URL-Routing#stateparams-service
var token = $stateParams.token
Hope it helps
Option-1: You can use $location service.
var t = $location.search().token
Option-2 If you are using ui-router, you may access the querystring parameters from $stateParams service too
var t = $stateParams.token
Cheers!
Try passing $location to your controller and use it like this.
.controller('YourController', ['$scope', '$stateParams', '$location' , function ($scope, $stateParams, $location) {
// Get token from query string
var token = $location.search().token;
}
You can get parameters with $location.search() into your controller. See below
// Given URL
// mainurl/exampleurl?token=23
var searchObject = $location.search();
// => {token: 23}
Related
I am trying to pass an ID via URL parameter to a page named "more.html". So the URL Parameter will like the following.
http://example.com/more.html?id=200
I used $location service in my controller on the more.html page to get the Parameter ID from the URL. Here is the controller code that I used.
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($location, $scope, $http) {
var sno = $location.search().id;
alert(sno);
});
The result I got from the above code was "Undefined".
Like what #daan.desmedt told. I changed the URL structure to the following and passed ID via it.
from:
http://example.com/more.html?id=200
to:
http://example.com/more.html#?id=200
I added # after more.html. It solved the problem.
Change you url structure as following (adding #)
from:
http://example.com/more.html?id=200
to:
http://example.com/more.html#?id=200
Adding the # more.html and before your url parameters will fix the problem.
Maybe for your next project you could make use of ui-router, which is a more structured way of using parameters.
https://github.com/angular-ui/ui-router
you are not defining the parameters you inject. It should look like below code:
var app = angular.module('myApp', []);
app.controller('customersCtrl', ['$location' , '$scope' , '$http' , function($location, $scope, $http) {
var sno = $location.search().id;
alert(sno);
}]);
Following is my $routeProvider.when
.when("/products/:id",{
templateUrl:"app/views/product.html",
controller:"productController"
})
I want to access the value of :id in the product controller.
Based on which i will populate product details.
the url is /index.html#/products/3
You can use $routeParams.id in your controller.
You can access it in your controller with $routeParams
app.controller('productController', function ($scope, $routeParams) {
$scope.productId = $routeParams.id;
};
Read more here
$stateParams are for custom ui-router
Inject $routeParams to your controller factory function.
.controller('MainController', function($scope, $routeParams) {
$scope.id= $routeParams.id;
})
Use the $location service
To access any part of a path you need to use the $location service. It lets you use different parts of the url. For instance (From docs)
// given url http://example.com/#/some/path?foo=bar&baz=xoxo
var url = $location.url();
// => "/some/path?foo=bar&baz=xoxo"
But what you want is this
// given url http://example.com/#/some/path?foo=bar&baz=xoxo
var path = $location.path();
// => "/some/path"
This will return a string that is everything after the #
so then you can Use slice or some other JS function to get the part you need.
Best of luck
How to access the URL parameters through the angularJS controller. For example: i would like to read parameter1 and parameter2 in a controller so that i can take appropriate action in my controller. http://localhost:8080/MyApplication?Parameter1=testresponse¶meter2=1234
After spending some time, i figured that $location is the one I was searching for. Below is sample code snippet. >>AngularJS v1.4.8
main.js
var mainApp = angular.module("app",['ui.bootstrap','ngModal']);
mainApp.config(['$locationProvider',function($locationProvider){
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
var mainController = function($scope,$window,$rootScope, $cookies,$cookieStore,$location){
var searchObject = $location.search();
window.alert("parameter is :.."+searchObject.param1);
window.alert("Url typed in the browser is: "+$location.absUrl());
}
mainApp.controller("MainController",["$scope","$window","$rootScope",'$location',mainController]);
Enter the this URL in the browser:
http://localhost:8180/Application/#param1=test
Output:
alert 1: parameter is :.. test
alert 2: "Url typed in the browser is: " +http://localhost:8180/Application/#param1=test
Inject $routeParams in your controller like
angular.module(yourapp).controller(yourcontroller,['$routeParams',
function($routeParams){
console.log($routeParams.Parameter1) //Prints test response
}]);
Using $routeParams service you can access url params. In your case
angular.module('myApp', [])
.controller('myController', (function ($scope, $routeParams) {
$routeParams.Parameter1 // for 1st param
$routeParams.parameter2 // for second param
});
For more information - $routeParams
I created a factory which is using the $resource factory, I want to customise the url params passed to the $resource according my current URL.
here's my code sample:
MyApp.factory("provider_services", ['$resource', function($resource) {
var factory = {};
var ProviderService = $resource("/providers/:provider/provider_services/", { format: 'json', provider: "pro" });
factory.services = ProviderService.query();
return factory;
}])
My current url is: somedomain.com/providers/pro/services/
I want to pull the "pro" part out of the url (that ideally can be anything else) and pass it in the provider param to the resource (in my current sample you can see it's hardcoded).
something like:
cur_provider = {get the current value from the url}
var ProviderService = $resource("/providers/:provider/provider_services/", { format: 'json', provider: cur_provider });
*I know I can do it using $location somehow, but I can't seem to access it within my provider_services factory.
Thanks !
You can use $routeParams to do this. It would look something like this:
angular.module('app').controller("ExampleController", ['$resource', '$routeParams', 'SomeService',
function($resource, $routeParams, SomeService) {
//The id here is whatever you name your route variable.
cur_provider = $routeParams.provider;
var ProviderService = $resource("/providers/:provider/provider_services/", { format: 'json', provider: cur_provider });
}
]);
Is the any way to get $state by URL?
app.controller('MyCtrlr', ['$scope', '$state', function ($scope, $state) {
function getStateByUrl(URL) {
... //what should I do here?
return stateObj;
}
}]);
If your aim is to get the name of the current state you can use
$state.current //whole object
and more specifically
$state.current.name //name of state
While this isn't getting it bythe URL I'm hoping it might be what you want?
Note: the URL is also available in the object if you need it.