I need to redirect to another page in angular js.
As , i have used following code to redirect. But is seems that is passing data through URL.
Need to post data to redirection URL.
Searched lot, but didn't find any solution.
Your help is highly appreciated.
$location.path('/refer').search({mobile: mobileNumber});
You can use state params to pass data to another as shown below:
JS:
.state('dashboard',{
url: '/dashboard',
templateUrl: 'views/dashboard.html',
controller: 'dashboardCtrl',
params : { areaName : null, city : null}
})
View:
<a ui-sref="customer.app.dashboard({areaName:area.area_name,city:area.city_id.city_name})">
Hope this helps..
you can use below. for this you need to inject $state
$state.go("refer", {"mobile" : mobileNumber});
Related
Hi i'm trying to pass a parameter from page A to B.let's say you get a name from user in page A and want to show it in page B.
I Googled a lot but there is not a working result so i can see how all parts work together.
Q :I know i need to use $stateParams here but how it's unclear for me.
Thanks is advance.
Below is an example of state params being used:
var app = angular.module('app', [])
app.config(function($stateProvider){
$stateProvider
.state('sample', {
url: '/sample/:name',
templateUrl: '.sampleView.html',
controller: 'SampleController'
})
app.controller('SampleController', function($stateParams) {
//access params by using $stateParams.<param name>
var name = $stateParams.name;
}
The scenario you described sounds more like something where you would want to use a factory/service or maybe even some browser caching.
I am trying to build a simple app, which goes the following way:
I have 2 menu items in the navbar: home and contact.
The home should be a unique URL only once from the server, at initialisation, read from a QR code (i got this covered, that is no problem to me) and the contact should always be the same.
I got the contact done in the following way:
$stateProvider.state('contact', {
url: '/contact',
templateUrl: 'src/views/contact.html',
controller: 'contactController'
})
The problem is with the home, which should keep the unique URL received by the server. How should i write the state for that one?
.state('home', {
url: '/:uid',
templateUrl: 'src/views/home.html',
})
Also, the home should keep it's unique url generated by the server after refresh and while navigating from contact to home.
In the HTML i would have something like
<a ui-sref="home({uid: --some dynamic uid?--})">Home</a>
this is the part which also requires help.
Set the home state to
.state('home', {
url: /{uid},
templateUrl: 'src/views/home.html',
})
and you could grab the parameters by injecting $stateParams into the controller. $stateParams.uid would return the parameters and store that in local storage or cookies.
Check this link out
https://github.com/angular-ui/ui-router/wiki/URL-Routing#stateparams-service
UPDATE:
for example, this is the sample controller that is attached to the home page
app.controller('homeCtrl', function($stateParams) {
var id = $stateParams.uid; //this is how you retrieve the uid
});
by going to your home page e.g. http://www.example.com/abcd12345, the above $stateParams.uid would return abcd12345
Now to set the url. simply use ui-sref instead of href on the <a> tag. ui-router will automatically generate href for you.
e.g.
<a ui-sref="home({uid:'abcd12345'})">Home</a>
You have to create a custom provider and inject it into the config.
eg:- .config($stateProvider, $urlRouterProvider,yourprovider) .
I am not sure about this. But please check this way too..
how can we send to another page using like $state.go('/user/15') from controller is it possible in angularJs using ionic framework
Thank you.
Refer to ui-router specification : http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state
You'll see that $state.go has 2 optional parameters:
- params
- options
$stateProvider.state('login/:experience_id/:context', {
url: '/login/:experience_id/:context',
templateUrl: 'templates/login.html',
controller: 'userController',
data: {'context': 'login','experience_id':':experience_id'},
therefore, use thefollowing command :
$state.go('login/:experience_id/:context',{experience_id:myIdNumber,context:'login'});
If you want to make a redirection :
You have to define a state in your app :
.state('user',
{url: '/user',
templateUrl: 'templates/user.html',
controller: 'userCtrl'});
So you can now use the directive ui-sref="" like that:
<a ui-sref="user">Go in my templates/user.html</a>
This will make the redirection on the page user.html
Ref : http://learn.ionicframework.com/formulas/navigation-and-routing-part-2/
I have configured the routes like this in my app :
$routeProvider
.when('/', {action: 'account_landing_page'})
.when('/:resource/:id/:extrajson', {action: 'open_resource'})
.when('/:resource/:id', {action: 'open_resource'})
.otherwise({redirectTo: '/'})
I want to be able to perform different operation if the url contains :extrajson. So I have this URL :
xyz/dashboard/1/%7B%22screen_shot_mode%22%3A%20%22on%22%7D
When this URL loads it loses all the urlencoded extra parameters and becomes :
xyz/#/dashboard/1
Can somebody tell me what am I doing wrong over here?
Can somebody explain me why is it happening?
Here are some snippets of code that might help you understand.
when('/search/:someid', {
templateUrl: 'partials/qviewplaceholder.html',
controller: 'Myctrl as somectrl'
}).
Notice the ":someid" part. Down in the controller will look this.
app.controller('Myctrl', ['$routeParams',function($routeParams) {
this.somedata = $routeParams.someid;
/*controller logic that uses $routeParams.someid for it's logic*/
}]);
You now have a template [partials/qviewplaceholder.html] and a variable passed into it via $routeParams. The $routeParams variable is usually some id that can be used to point to some object. Then display the data accordingly. Also, here is a video demonstrating the use of $routeparams. https://www.youtube.com/watch?v=ziUelciLL5Q
Those parameters are meant to be part of the URL path. So it would match /:resource/:id/:extrajson to /foo/bar/baz, where $routeParams gets parsed into:
{
"resource": "foo",
"id": "bar",
"extrajson": "baz"
}
https://docs.angularjs.org/api/ngRoute/service/$routeParams
I've been trying all day to get the AngularUI Router working with 1.2.0-rc.3, but to no avail. I'm pretty sure it's a bug, as a lot of things have been changed in rc3, but maybe someone has found a workaround for it.
This is what I'm trying to do:
In my app.config()
var login = {
url : '/login',
name : 'login',
templateUrl: 'views/login.html',
controller : 'LoginCtrl'
};
var main = {
url : '/',
name : 'main',
templateUrl: 'views/main.html',
controller : 'MainCtrl'
};
var reportsOverview = {
url : '/reports',
name : 'main.reports',
controller : 'ReportsCtrl',
templateUrl: 'views/main.reports.html'
};
$stateProvider.state(login);
$stateProvider.state(main);
$stateProvider.state(reportsOverview);
When I go to /login, my template gets displayed as expected. When I go to / or /reports however, I see nothing. I've got a <div ui-view></div> in both my index.html and views/main.html file, so that's not the issue.
Anyone out there experiencing the same issue, or what am I doing wrong?
It's hard without being able to see the custom templates, but some things I noticed that you are going to /reports. Urls are additive, so, in your case because the main url is / and your reports url is /reports the actual url you would have to go to is //reports not /reports. Try making your reports url reports and then /reports should work.
I would try to use ui-sref directive to create links on your web page so that you can see what urls the routing is generating for each state and check that it is what you expect.
It would be really helpful if you could include a plunkr that demonstrates the problem you are having.