AngularJs : 페이지 새로 고침

AngularJs : 페이지 새로 고침

---

<a ng-href="#" class="navbar-brand" title="home" data-translate>PORTAL_NAME</a>

페이지를 새로 고침하고 싶습니다. 어떻게해야합니까?

---

서비스 reload방법을 사용할 수 있습니다 $route. $route컨트롤러에 주입 한 다음에 메소드를 작성 reloadRoute하십시오 $scope.

$scope.reloadRoute = function() {
   $route.reload();
}

그런 다음 다음과 같이 링크에서 사용할 수 있습니다.

<a ng-click="reloadRoute()" class="navbar-brand" title="home"  data-translate>PORTAL_NAME</a>

이 방법을 사용하면 현재 경로가 다시로드됩니다. 그러나 전체 새로 고침을 수행하려는 경우 다음을 주입 $window하여 사용할 수 있습니다.

$scope.reloadRoute = function() {
   $window.location.reload();
}

나중에 편집 (ui-router) :

답변에서 JamesEddyEdwards와 Dunc이 언급했듯이 angular-ui / ui-router 를 사용하는 경우 다음 방법을 사용하여 현재 상태 / 경로를 다시로드 할 수 있습니다. $state대신에 주사 $route하면 다음이 있습니다.

$scope.reloadRoute = function() {
    $state.reload();
};

---

window더 쉬운 테스트 및 조롱을$window 위해 서비스를 통해 객체를 사용할 수 있으며 다음과 같은 작업을 수행 할 수 있습니다.

$scope.reloadPage = function(){$window.location.reload();}

그리고 :

<a ng-click="reloadPage"  class="navbar-brand" title="home"  data-translate>PORTAL_NAME</a>

참고로, $ route.reload () 실제로 실제로 페이지를 다시로드한다고 생각하지는 않지만 route 만 생각 합니다 .

---

 location.reload(); 

트릭을 수행합니다.

<a ng-click="reload()">

$scope.reload = function()
{
   location.reload(); 
}

경로가 필요하거나 평범한 오래된 JS가 필요하지 않습니다.

---

Alexandrin의 답변과 비슷하지만 $ route 대신 $ state를 사용합니다.

(JimTheDev의 SO 답변 에서 여기에 있습니다 .)

$scope.reloadState = function() {
   $state.go($state.current, {}, {reload: true});
}

<a ng-click="reloadState()" ... 

---

내가 권장하는 Angulars보다 고급 ui-router 를 사용한다면 이제 간단하게 사용할 수 있습니다.

$state.reload();

Dunc의 대답과 본질적으로 같은 것입니다.

---

무한 루프를 피하는 내 해결책은 리디렉션을 만든 다른 상태를 만드는 것입니다.

$stateProvider.state('app.admin.main', {
    url: '/admin/main',
    authenticate: 'admin',
    controller: ($state, $window) => {
      $state.go('app.admin.overview').then(() => {
        $window.location.reload();
      });
    }
  });

---

It's easy enough to just use $route.reload() (don't forget to inject $route into your controller), but from your example you could just use "href" instead of "ng-href":

<a href=""  class="navbar-brand" title="home"  data-translate>PORTAL_NAME</a>

You only need to use ng-href to protect the user from invalid links caused by them clicking before Angular has replaced the contents of the {{ }} tags.

---

On Angular 1.5 - after trying some of the above solutions wanting to reload only the data with no full page refresh, I had problems with loading the data properly. I noticed though, that when I go to another route and then I return back to the current, everything works fine, but when I want to only reload the current route using $route.reload(), then some of the code is not executed properly. Then I tried to redirect to the current route in the following way:

$scope.someFuncName = function () {
    //go to another route
    $location.path('/another-route');
};

and in the module config, add another when:

.config(['$routeProvider', function($routeProvider) {
     $routeProvider.when('/first-page', {
         templateUrl: '/first-template',
         controller: 'SomeCtrl'
     }).when('/another-route', {//this is the new "when"
         redirectTo: '/first-page'
     });
}])

and it works just fine for me. It does not refresh the whole page, but only causes the current controller and template to reload. I know it's a bit hacky, but that was the only solution I found.

---

<a title="Pending Employee Approvals" href="" ng-click="viewPendingApprovals(1)">
                    <i class="fa fa-user" aria-hidden="true"></i>
                    <span class="button_badge">{{pendingEmployeeApprovalCount}}</span>
                </a>

and in the controller

 $scope.viewPendingApprovals = function(type) {
                if (window.location.hash.substring(window.location.hash.lastIndexOf('/') + 1, window.location.hash.length) == type) {
                    location.reload();
                } else {
                    $state.go("home.pendingApproval", { id: sessionStorage.typeToLoad });
                }
            };

and in the route file

.state('home.pendingApproval', {
        url: '/pendingApproval/:id',
        templateUrl: 'app/components/approvals/pendingApprovalList.html',
        controller: 'pendingApprovalListController'
    })

So, If the id passed in the url is same as what is coming from the function called by clicking the anchor, then simply reload, else folow the requested route.

Please help me improve this answer, if this is helps. Any, suggestions are welcome.

---

Angular 2+

I found this while searching for Angular 2+, so here is the way:

window.location.reload();

참고URL : https://stackoverflow.com/questions/21885518/angularjs-reload-page