hello ,
i want to to display welcome message with user name in other page after successfully login
already wasted my 2 hours
can anybody help me
please give proper solution
Can you provide more Informations about the structure of your app? There are many ways to implement this, but which way to go depends on your app and the structure.
If you just want to paste some values to the next state you could delivere them to the next state:
$state.go('myapp.afterloginstate', {
username: $scope.username
})
Please note,that you have to configure your state for this like so:
app.state('myapp.afterloginstate', {
url: "/afterloginstate",
params: {
username: ""
},
templateUrl: "path/to/template",
controller: 'AfterloginController'
}).controller(‘AppCtrl’, function($scope, $ionicModal, $timeout,$location,$http,$log,$state) {
$scope.doLogin = function(loginData) {
if($scope.loginData.username=="admin" && $scope.loginData.password=="admin")
{
alert('login successfull');
// window.localStorage['user'] = $scope.loginData.username;
$state.go('app.welcomeuser');
}
}
.controller(‘WelcomeCtrl’,function($scope,$http,$log,$state) {
// alert($scope.user);
$scope.showImages = function()
{
$state.go('app.contestDetail');
}
})
above is my code
now i want to access username in welcome controller
One way to do that is by injecting $rootScope in your controllers and by associating a variable with $rootScope to store the username.
.controller('AppCtrl', function($scope,$rootScope, $ionicModal, $timeout,$location,$http,$log,$state) {
$scope.doLogin = function(loginData) {
if($scope.loginData.username=="admin" && $scope.loginData.password=="admin")
{
alert('login successfull');
$rootScope.username = $scope.loginData.username;
$state.go('app.welcomeuser');
}
}
.controller('WelcomeCtrl',function($scope,$rootScope, $http,$log,$state) {
alert($rootScope.username);
$scope.showImages = function() {
$state.go('app.contestDetail');
}
})
Otherwise, if you are using a controller for your ‘app’ state, you can declare a $scope object in it’s controller and access/modify that object in any of its nested states.
Try something like this:
$scope.user = {};
$scope.user.name = $scope.loginData.username;hello sir,
if i m using rootscope
i need to pass as parameter ?
bcoz i try to use rootscope it’s not working
Yes you need to inject $rootScope into your onctroller to use it.
Another way is to wrap your login code into a factory/service that caches username.
Just inject the $rootScope in both controllers.
.controller('AppCtrl', function($scope, $ionicModal, $timeout,$location,$http,$log,$state, $rootScope) { ...
.controller('WelcomeCtrl',function($scope,$http,$log,$state, $rootScope) {...
Then add the username to the rootScope:
if($scope.loginData.username=="admin" && $scope.loginData.password=="admin")
{
alert('login successfull');
$rootScope.username = $scope.loginData.username;
$state.go('app.welcomeuser');
}
In the WelcomeController you can acces the username like this:
$rootScope.username;hello sir
getting undefined value in welcome controller
stuff in littel bit code
i dont khow what is the actual issue
Can you please share the code which you’ve written?
I will test the same and try to find out the reason for the ‘undefined value’ error.
below is my contoller code
.controller(‘AppCtrl’, function($scope, $ionicModal, $timeout,$location,$http,$log,$state,$rootScope) {
// Form data for the login modal
$scope.loginData = {};
// Create the login modal that we will use later
$ionicModal.fromTemplateUrl(‘templates/login.html’, {
scope: $scope
}).then(function(modal) {
$scope.modal = modal;
});
// Triggered in the login modal to close it
$scope.closeLogin = function() {
$scope.modal.hide();
};
// Open the login modal
$scope.login = function() {
$scope.modal.show();
};
// Perform the login action when the user submits the login form
$scope.doLogin = function(loginData) {
if($scope.loginData.username=="admin" && $scope.loginData.password=="admin")
{
alert('login successfull');
// window.localStorage['user'] = $scope.loginData.username;
$rootScope.username = $scope.loginData.username;
$state.go('app.welcomeuser');
}
else
{
alert('Please try correct username or password');
$state.go('app.playlists');
}
// console.log(‘Doing login’, $scope.loginData);
$timeout(function() {
$scope.closeLogin();
}, 1000);
};
})
.controller(‘WelcomeCtrl’,function($scope,$http,$log,$state,$rootScope) {
alert(“hi”+$rootScope.username);
$scope.showImages = function()
{
$state.go('app.contestDetail');
}
// alert($scope.f_uname);
})
Plz help me sir
i don’t know what is the actual problem
as you told me , apply all possible ways
You have not initialized “username” and I believe that the code inside ‘if’ block is not even executed since the $scope.loginData.username is undefined.
I would use a Route Resolve. This allows you to “resolve” the user on an (abstract) parent UI Router state, and all the child UI Router states states then automatically inherit this. For example:
$stateProvider
// the app's root state, this does not have access to User yet
// (the idea is that some menu options are accessible without being logged in)
.state('app', {
url: "/app",
abstract: true,
templateUrl: "js/app/menu/menu.html"
})
//
// All UI-router states that are children of 'app.auth' need a valid user - this is enforced through a Route
// Resolve, as you can see below ("UserService.checkUser()")
//
// When the resolve fails (meaning the user is not logged in), a $stateChangeError is triggered.
// You can register a listener with this event and .
//
.state('app.auth', {
url: "/auth",
abstract: true,
template: '<ion-view/>',
resolve: {
user: function (UserService) {
return UserService.checkUser();
}
}
})
Now you can simply inject the resolved “user” variable in any controller which is attached to a child state of ‘app.auth’, for example:
...........
.controller('CreditBalanceCtrl',function ($scope, user) { ... })
...........
So you simply inject the “user” variable if you need to access user info, it’s very easy to use. If you don’t need access to user data then you don’t need to inject the “user” variable of course.
For a lot of other things I’m not using “route resolves” because they have a number of drawbacks, but this is a very nice use case for route resolves.
This technique is explained here:
http://www.clearlyinnovative.com/starter-ionic-application-template-wparse-integration