AngularJSを使用してページ全体を再読み込みまたは再レンダリングする方法

いくつかのユーザーコンテキストに基づいてページ全体をレンダリングし、いくつかの$http要求を行った後、ユーザーがコンテキストを切り替えてすべてを再度レンダリングできるようにしたい（すべての$http要求を再送信するなど）。ユーザーを別の場所にリダイレクトするだけであれば、物事は適切に機能します。

$scope.on_impersonate_success = function(response) {
  //$window.location.reload(); // This cancels any current request
  $location.path('/'); // This works as expected, if path != current_path
};

$scope.impersonate = function(username) {
  return auth.impersonate(username)
    .then($scope.on_impersonate_success, $scope.on_auth_failed);
};

を使用すると、応答を待機しているリクエストの$window.location.reload()一部がキャンセルされるため、使用できません。また、ハッキングも機能しません（何も起こりません）。$httpauth.impersonate(username)$location.path($location.path())

手動ですべてのリクエストを再度発行せずにページを再レンダリングする別の方法はありますか？

記録のために、angularに現在のページを再レンダリングすることを強制するには、以下を使用できます。

$route.reload();

AngularJSのドキュメントによると：

$ locationが変更されていなくても、$ routeサービスは現在のルートを再読み込みします。

その結果、ngViewは新しいスコープを作成し、コントローラーを再インスタンス化します。

$route.reload()コントローラーは再初期化しますが、サービスは再初期化しません。アプリケーションの状態全体をリセットしたい場合は、以下を使用できます。

$window.location.reload();

これは、$ windowサービスの注入にアクセスできる標準のDOMメソッドです。

サーバーからページを確実にリロードしたい場合、たとえばDjangoまたは別のWebフレームワークを使用していて、サーバー側の新しいレンダリングが必要な場合は、ドキュメントで説明されているように、trueパラメーターとしてに渡します。それはサーバーとの相互作用を必要とするので、それは遅くなりますので、必要な場合にのみ行ってくださいreload

角度2

上記の私は角度2を使用していない角度の1に適用され、サービスのように見えますが異なっている、そこにあるRouter、LocationとDOCUMENT。そこでは異なる動作をテストしていません

指定されたルートパスのページをリロードする場合：-

$location.path('/path1/path2');
$route.reload();

角度のあるui-routerを使用している場合、これが最適なソリューションです。

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

コントローラの依存関係を宣言するときに「$ route」を追加するのを忘れたのかもしれません。

app.controller('NameCtrl', ['$scope','$route', function($scope,$route) {   
   // $route.reload(); Then this should work fine.
}]);

すべてをリロードするには、window.location.reload（）;を使用します。angularjsで

実施例を確認する

HTML

<div ng-controller="MyCtrl">  
<button  ng-click="reloadPage();">Reset</button>
</div>

angularJS

var myApp = angular.module('myApp',[]);

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

http://jsfiddle.net/HB7LU/22324/

使用しているサービスを更新しながらコントローラーを更新したい場合は、次のソリューションを使用できます。

• $ stateを挿入する

すなわち

app.controller('myCtrl',['$scope','MyService','$state', function($scope,MyService,$state) {

    //At the point where you want to refresh the controller including MyServices

    $state.reload();

    //OR:

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

これにより、コントローラとHTMLが更新され、RefreshまたはRe-Renderと呼ぶことができます。

Angular 2の前（AngularJs）

ルート経由

$route.reload();

アプリケーション全体をリロードしたい場合

$window.location.reload();

Angular 2+

import { Location } from '@angular/common';

constructor(private location: Location) {}

ngOnInit() {  }

load() {
    this.location.reload()
}

または

constructor(private location: Location) {}

ngOnInit() {  }

Methods (){
    this.ngOnInit();
}

私が考えた最も簡単な解決策は、

戻ってきたときに毎回リロードしたいルートに「/」を追加します。

例えば：

次の代わりに

$routeProvider
  .when('/About', {
    templateUrl: 'about.html',
    controller: 'AboutCtrl'
  })

使用する、

$routeProvider
  .when('/About/', { //notice the '/' at the end 
    templateUrl: 'about.html',
    controller: 'AboutCtrl'
  })

次のいずれかを試してください。

$route.reload(); // don't forget to inject $route in your controller
$window.location.reload();
location.reload();

キャッシュを削除してページを再読み込みするためのこの作業コードを取得しました

見る

        <a class="btn" ng-click="reload()">
            <i class="icon-reload"></i> 
        </a>

コントローラ

インジェクター：$ scope、$ state、$ stateParams、$ templateCache

       $scope.reload = function() { // To Reload anypage
            $templateCache.removeAll();     
            $state.transitionTo($state.current, $stateParams, { reload: true, inherit: true, notify: true });
        };

ユーザーに親密なリロード通知をせずに次のコードを使用します。ページをレンダリングします

var currentPageTemplate = $route.current.templateUrl;
$templateCache.remove(currentPageTemplate);
$window.location.reload();

私は何ヶ月もこの問題に苦労してきました、そして私のために働いた唯一の解決策はこれです：

var landingUrl = "http://www.ytopic.es"; //URL complete
$window.location.href = landingUrl;