How to make a generic close button for angular ui-views?

Question

I need a function where I can use $window.history.back() to be called from every view regardless of what controller is controlling that page.

.run(['$rootScope', '$state', 'CommonUserModel', 'InitialiseService','$window', function($rootScope, $state, $window, commonUserModel, initialiseService) {

    $rootScope.link = function(){
        $window.history.back();
    };

So I have this function put in the app module. Injected window object because it complained about it. But now it also complains that it "Cannot read property 'back' of undefined".

I am calling this function with $rootScope from other controllers as I read through StackOverflow. I had to inject $rootScope to other controllers like this.

homeViewModule.controller("simDetailsController", [ '$rootScope','$scope', 'ModalDialogService', 'CommonTagModel', '$location','$window',
                                        function($scope, modalDialogService, commonTagModel, $location, $window,$rootScope) { 
self.link = function(){
   $rootScope.link();};

Can you give me an advice? Keep in mind that I am pretty newbie on AngularJS I still don't get this messy, complex framework.

score 0 · Answer 1 · answered Jul 13 '17 at 13:33

0

You should use routes:

https://docs.angularjs.org/api/ngRoute/service/$route

answered Jul 13 '17 at 13:33

marcosvolpato

106
1
3

We are using ui.router (ui-view) instead for routing. But we can review it. I still didn't see anything about how to make a close button for those views. you mean I should each time write an href to close button? – tekin Jul 13 '17 at 13:45
setTimeout(function() { $window.history.back(); },100); – marcosvolpato Jul 13 '17 at 14:01

score 0 · Accepted Answer · answered Jul 13 '17 at 13:34

The order in which you have injected $window & $rootScope in the parameters list does not match the string array list.
You have mentioned '$window' as the 5th element in the string array, while, it is the 3rd element in the parameters list.
Also, in your code, '$rootScope' is the 1st element in the string array, while, it is the 6th element in the parameters list.

Replace the first lines in both of your code snippets with these:

.run(['$rootScope', '$state', 'CommonUserModel', 'InitialiseService','$window', function($rootScope, $state, commonUserModel, initialiseService, $window) {

homeViewModule.controller("simDetailsController", [ '$rootScope','$scope', 'ModalDialogService', 'CommonTagModel', '$location','$window', function($rootScope, $scope, modalDialogService, commonTagModel, $location, $window) {

actually you are right there was a problem in the app module list. But not in controllers. Actually, in the controller, do I have to do the window injection again? It was legacy code, because before I was injecting it and putting the same function to every controller which was why I thought there must be better way. — tekin, Jul 13 '17 at 13:38
Perfect it worked. And in one controller, I only injected $rootScope; in the other, I did both $rootScope and $window. So both is working means that I don't really need window in controllers. Saves me a bit of typing. — tekin, Jul 13 '17 at 13:41

How to make a generic close button for angular ui-views?

2 Answers2