I’m building a login form and when the user enters the correct user and password a page is displayed.
It’s working.
But when the login occurs I save the user data using localstorage.
For some reason the data inside localstorage is only displayed when I refresh the page.
How can I solve this ?
I’m getting the data from localstorage.
I have to display an image inside a sidemenu.
After login, the app is redirected to the main page with sidemenu.
When I expand the sidemenu the image is not displayed.
If I refresh the page the image is displayed.
When the app is redirected to app.modules a page with sidemenu is displayed:
<ion-header-bar class="bar-profile">
<div class="profile">
<!-- THIS DOESN'T WORK: USER IS UNDEFINED -->
<!-- USER IS ONLY AVAILABLE WHEN REFRESH THE PAGE -->
<img class="profile-picture" src="{{user.avatar_path}}" />
</div>
</ion-header-bar>
And the data from localstorage inside appcontroller:
function AppController($scope,
$window) {
$scope.teste = $window.localStorage['user]
};
<ion-header-bar class="bar-profile">
<div class="profile">
<!-- THIS DOESN'T WORK: USER IS UNDEFINED -->
<!-- USER IS ONLY AVAILABLE WHEN REFRESH THE PAGE -->
<img class="profile-picture" src="{{teste().avatar_path}}" />
</div>
</ion-header-bar>
this will make your view update reactively, but it is not efficient(i guess?)
could you please try this out, and let me know if it helped?
I’m not sure why it didnt work for you.
I just created a new project and it works as i described
here is the some sample from starter project
.controller('ChatsCtrl', function($state, $scope, Chats) {
// With the new view caching in Ionic, Controllers are only called
// when they are recreated or on app start, instead of every page change.
// To listen for when this page is active (for example, to refresh data),
// listen for the $ionicView.enter event:
//
//$scope.$on('$ionicView.enter', function(e) {
//});
$scope.vm = {};
$scope.onClickButton = function() {
localStorage.setItem('userDetails', JSON.stringify($scope.vm));
$state.go('tab.chat-detail');
}
$scope.chats = Chats.all();
$scope.remove = function(chat) {
Chats.remove(chat);
};
})
.controller('ChatDetailCtrl', function($scope, $stateParams, Chats) {
$scope.chat = Chats.get($stateParams.chatId);
$scope.user = function() { return localStorage.getItem('userDetails'); };
})
The rest of the code comes with starter project, so i didnt clear them.
Check the Video to see how this code works
If it will not work you again, i can help you if you share some repo or plunker showing the problem
But as i said before it is not efficient, and can slow your application.
You need to use this function on ng-init to get the values and store inside some scope variable.
If I were you I shouldn’t trust localstorage for authentication. My first release used it and it is non persistent on most devices which lead to alot of bugs and complaints. My suggestion is to use sqlite: http://ngcordova.com/docs/plugins/sqlite/, could save you alot of trouble