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();
}

**Later edit (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()는 실제로 페이지를 새로고침하지 않고 루트만 새로고침한다고 생각합니다.

 location.reload(); 

효과가 있다.

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

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

루트나 단순한 오래된 js는 필요 없습니다.

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

(여기서 Jim The Dev의 SO 답변에서)

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

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

Angules 보다 고급 ui-router를 사용하는 경우 다음과 같이 간단하게 사용할 수 있습니다.

$state.reload();

그것은 본질적으로 던크의 대답과 같은 것을 하는 것이다.

무한 루프를 피하기 위한 해결책은 리다이렉션을 실행한 다른 상태를 만드는 것이었습니다.

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

각도 2 이상

Angular 2+를 검색하던 중 이를 발견했으므로 다음과 같은 방법이 있습니다.

$window.location.reload();

이를 수행하려면 JavaScript에서 reload() 메서드를 호출합니다.

location.reload();

사용하기만 하면 됩니다.$route.reload()(컨트롤러에 $route를 삽입하는 것을 잊지 마십시오).이 예에서는 "ng-href" 대신 "href"를 사용할 수 있습니다.

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

ng-href를 사용하면 Angular가 {{}} 태그의 내용을 대체하기 전에 클릭함으로써 발생하는 비활성 링크로부터 사용자를 보호할 수 있습니다.

Angular 1.5에서는, 상기의 솔루션 중 몇개를 시험하고 나서, 풀 페이지의 리프레시 없이 데이터만을 새로고침하려고 하면, 데이터를 올바르게 로드하는 데 문제가 있었습니다.단, 다른 루트로 이동한 후 현재 루트로 돌아가면 모든 것이 정상적으로 동작하지만, 현재 루트를 새로고침 할 때만$route.reload()일부 코드가 제대로 실행되지 않습니다.다음으로 다음 방법으로 현재 루트로 리다이렉트를 시도했습니다.

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

설정에서 모듈 설정을 합니다.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'
     });
}])

나한테는 잘 먹혀들어페이지 전체를 새로 고치는 것이 아니라 현재 컨트롤러와 템플릿만 새로고침됩니다.좀 엉터리인 건 알지만, 그게 내가 찾은 유일한 해결책이었어.

<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>

컨트롤러에 있습니다.

 $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 });
                }
            };

루트 파일에는

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

따라서 url로 전달된 ID가 anchor를 클릭하여 호출된 함수에서 전송된 ID와 동일한 경우 새로고침하기만 하면 됩니다.그렇지 않으면 요청된 경로를 따릅니다.

이 답변이 도움이 된다면 개선하도록 도와주세요.어떤 제안이든 환영합니다.

이를 수행하려면 플레인 JavaScript에서 window 객체의 reload() 메서드를 호출합니다.

window.location.reload();

그 페이지를 참고할 것을 제안합니다.공식 제안

https://docs.angularjs.org/guide/$location

언급URL : https://stackoverflow.com/questions/21885518/angularjs-reload-page