I did this below to detect back button hit to previous page, but the detection is working fine, my headache is that the app run functions variable $rootScope.UseInController don't pass the data once to controller.
Here is the script.
App.run(function($rootScope, $location, $route, $localStorage){
$rootScope.$on('$locationChangeStart', function() {
$rootScope.$on('$locationChangeSuccess', function() {
// Check if you've been here before.
$rootScope.actualLocation = $location.path();
});
});
$rootScope.$watch(
function() {
return $location.path();
},
function(newLocation, oldLocation){
if($rootScope.actualLocation === newLocation) {
$rootScope.backClicked = true;
}
},true);
})
Please help me out....
This is what i finally does and make it worked perfectly, i delay my controller a bit.
$timeout(function(){..}, 5);
Related
I added the angular-block-ui module to my Angular project but it was not blocking the UI automatically during my ajax requests.
So, I tried to use it manually and it shows the block screen but it does not dismiss it.
So, I did a more simple test, just showing the block and trying to stop it after 2 seconds, and same issue. The screens gets blocked but it does not go away.
Here is my code:
'use strict';
myApp.controller('LoginModalCtrl', function ($scope, blockUI) {
$scope.login = function () {
console.log("on submit");
blockUI.start();
setTimeout(function(){
//do what you need here
blockUI.stop();
console.log("finished")
}, 2000);
}
})
;
Any idea what I am doing wrong?
You need to wrap it in a $scope.apply
$scope.$apply(function () {
blockUI.stop();
});
All this "blocking" consist of putting div on top of your page. Thats it.
Well it works: http://plnkr.co/edit/HjXcgQD7JghFjtsOAEo0?p=preview
You should use $timeout, not setTimeout.
Dont want to go into details, but it doesnt seem to be that smart library thow...
You should use $timeout, not setTimeout.
'use strict';
myApp.controller('LoginModalCtrl', function ($scope, blockUI, $timeout) {
$scope.login = function () {
console.log("on submit");
blockUI.start();
$timeout(function(){
//do what you need here
blockUI.stop();
console.log("finished")
}, 2000);
}
})
I have a problem.
.controller('A_Ctrl', function($scope){
$scope.getdata = function(){
console.log("ok");
}
})
I want to execute the function $scope.getdata() when view change by this view each time.
But this function is executed only once when change view by this view at first time.
My suggestion is possible in angularjs?
You forget to call the function, add the following sentence:
$scope.getdata();
Another solution: wrap it in a $rootScope and use a $location if you
want more control and based on the url you can
call getdata() or not.
var app = angular.module('app', [])
.run(function($rootScope, $location) {
$rootScope.$on('$routeChangeStart', function() {
$rootScope.getdata();
});
})
.controller('A_Ctrl', function($rootScope){
$rootScope.getdata = function(){
console.log("ok");
};
$rootScope.getdata(); //----- missed line
});
But I recommend the first approach.
Make the function self-executing.
($scope.getdata = function(){
console.log("ok");
})();
I am trying to retrieve my search and filter data from sessionStorage when the page refreshes.
sessionStorage.restorestate returns undefined, does anyone know why?
app.run(function($rootScope) {
$rootScope.$on("$routeChangeStart", function(event, next, current) {
if (sessionStorage.restorestate == "true") {
$rootScope.$broadcast('restorestate'); //let everything know we need to restore state
sessionStorage.restorestate = false;
}
});
//let everthing know that we need to save state now.
window.onbeforeunload = function(event) {
$rootScope.$broadcast('savestate');
};
});
Plunkr: http://plnkr.co/edit/oX4zygwB0bDpIcmGFgYr?p=preview
When you refresh the page in an Angular app, it is like completely rebooting the application. So to restore from the session storage, just do it when the service factory executes.
app.factory('CustomerSearchService', ['$rootScope',
function($rootScope) {
...
function restoreState() {
service.state = angular.fromJson(sessionStorage.CustomerSearchService);
}
if (sessionStorage.CustomerSearchService) restoreState();
...
}
]);
The saving part was already correct.
app.factory('CustomerSearchService', ['$rootScope',
function($rootScope) {
...
function saveState() {
sessionStorage.CustomerSearchService = angular.toJson(service.state);
}
$rootScope.$on("savestate", saveState);
...
}
]);
app.run(function($rootScope) {
window.onbeforeunload = function(event) {
$rootScope.$broadcast('savestate');
};
});
DEMO
first of all, i'm a noob to AngularJS - hope someone can help with this one. I really don't get it..
I have a AngularJS app, with a "service" that return a promise, that works all well, but the problem is, if my app at the beginning is offline, and afterward gets online, now I want the service promise to refresh.
If my app is online at the beginning, it all works well.
But if it is offline, and later gets online, and the reload button is clicked - the alert("TEST TEST"); never gets executed :(
.service('webService', function ($http, $q, $timeout){
var webservice_url = "http://mywebservice_url";
var deferred = $q.defer();
var service = {};
service.refresh = function() {
$http.get(webservice_url+"?action=get_settings", {timeout: 2000})
.success(function(data) {
deferred.resolve(data);
})
.error(function(err) {
deferred.reject({'error': err});
});
return deferred.promise;
}
this.refresh = function() {
this.promise = service.refresh();
return this.promise;
}
this.promise = service.refresh();
})
.controller('NetworkCtrl', function($scope, $location, $timeout, webService) {
$scope.reloadClick = function(){
webService.refresh().then(function(data) {
alert("TEST TEST");
console.log(data);
});
}
})
I am not 100% positive... cause I can't run your code... but I think that moving line three into the service.refresh method, that should get you closer.
I am inserting a record into a SharePoint custom list from an AngularJS Service -- works great! When the promise is returned, I just want the browser to go to the default route because a SharePoint workflow will take over after insert.
The browser just stays on the form when I use the following in my controller:
var SystemDownController = function($scope, $location, SharePointJSOMService){
$scope.addNewSystemDown = function($event){
$event.preventDefault();
$.when(SharePointJSOMService.addSystemDown($scope.frm))
.done(function(id){
$location.path('/');
})
.fail(function(err){
console.info(JSON.stringify(err));
});
};
}; // end SystemDownController
SystemDownController.$inject = ['$scope', '$location', 'SharePointJSOMService'];
angular.module('appITI').controller('SystemDownController', SystemDownController);
You would better use native Angular promise implementation:
$q.when(SharePointJSOMService.addSystemDown($scope.frm))
.then(function(id) {
$location.path('/');
}, function(err) {
console.info(JSON.stringify(err));
});
Or if you still want to use jQuery promises then you should trigger digest loop yourself:
.done(function(id) {
$location.path('/');
$scope.$apply();
})
$scope.$apply();