How to reload page (angularJs)

Question

We have MVC application using AngularJs for front-end. The menu view has the following code

 <ul>
                                @foreach (var child in parent.Children)
                                {
                                    <li class="@MenuHelper.SetChildClass(child, ViewBag) childNode">
                                        <a href="@child.NavigateUrl">@child.Text</a>
                                    </li>
                                }
                            </ul>

We also have several single page forms in our application (so they are supposed to show just an index view). They have Cancel button that has the following code:

 $scope.cancel = function () {
                // window.console && console.log("Cancel fired");
                $scope.form.$setPristine();
                $scope.showForm = false; // close the form
                //$state.go('home', {}, { reload: "true" });
            };

So, here is the problem. From the main menu (or from the Favorites menu) I activate that single page form. I press the Cancel button. I then try to activate that menu again (say, from Favorites). And - nothing happens. I am only seeing spinning circle. That form's controller's code is never firing.

I believe the problem is in caching and that re-load never happens. My question is - what do I need to do to make sure that page is re-loading? I checked a few threads, but they are not using the code in the menu view I showed. I also tried the following in the js file of one of such pages:

app.config(['$stateProvider',function($stateProvider) {
        $stateProvider.state('home', {
            url: '/',
            template: '',
            cache: false
        }).
        state('edit', {
            url: '/edit/:id',
            cache: false
        }).state('new', {
            url: '/new',
            cache: false
        });
    }]);

E.g. I've added cache: false

But it made no effect. I think I need something in the menu file instead but I'm not sure how to fix that line @child.Text to make sure it re-loads.

EDIT: from comment.

My controller for the page in question has the following code:

app.controller('prefsSlsSearchController', ['$scope', '$rootScope', '$timeout', '$state', 'prefsSlsService', 'resourceFactory', function ($scope, $rootScope, $timeout, $state, prefsSlsService, resourceFactory) { 
var init = function () { 
  $scope.isEditLoading = true; 
  window.console && console.log("Init fired"); 
  $scope.disableAction = false; 
  $scope.showForm = false; 
  doSearch(); 
};

That msg never shows scnd time

buzzsaw · Accepted Answer · 2015-10-13 18:51:03Z

1

With ui-router you can use

$state.go($state.$current, null, { reload: true });

or

$state.transitionTo($state.current, $stateParams, { reload: true, inherit: true, notify: true });

or

$state.reload();

If you are using the $routePovider, you can use $route.reload();

answered Oct 13, 2015 at 18:51

buzzsaw

1,4961 gold badge10 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

11 Comments

Naomi Over a year ago

The problem here is that we have main menu and that menu view has the code I posted. So, it has a href="page to go". And that's all I see so far. We do use ui-router in general, but I don't see where to put that code? As you see, I have defined states and I also tried adding reload: true to the function that is called from the Init of my controller for that page. But the Init is never firing

buzzsaw Over a year ago

I would need to see more of your code to be able to help at this point. There isn't enough to properly debug the issue you are having with what you have currently posted. If you can create a fiddle or plunker showing this problem, we can better help you diagnose the issue.

Naomi Over a year ago

My controller for the page in question has the following code: app.controller('prefsSlsSearchController', ['$scope', '$rootScope', '$timeout', '$state', 'prefsSlsService', 'resourceFactory', function ($scope, $rootScope, $timeout, $state, prefsSlsService, resourceFactory) { var init = function () { $scope.isEditLoading = true; window.console && console.log("Init fired"); $scope.disableAction = false; $scope.showForm = false; doSearch(); }; That msg never shows scnd time

Naomi Over a year ago

It's a very complex app:( We load menu in run-time. The menu has URL to go (I posted the code). When I invoke that URL first time, the page loads. When I do the second time, it shows spinning circle. Init method from page controller never fires in this case. So, I think I somehow need to change that line a href='somepage' to something that will always reload that page. Do you have ideas?

buzzsaw Over a year ago

My first suggestion, without knowing anything about how or where your methods are being called, is to make the init() function available on the scope so it is registered in Angular and can trigger a $digest cycle when called. eg: $scope.init = function () {...}

|

agonzalezmc · Accepted Answer · 2015-10-30 11:12:21Z

0

In your controller you must pass $window . And use: $window.location.reload(); inside of your function.

It's works for me.

answered Oct 30, 2015 at 11:12

agonzalezmc

1131 gold badge3 silver badges13 bronze badges

Collectives™ on Stack Overflow

How to reload page (angularJs)

2 Answers 2

11 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

11 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related