javascript - AngularJS:位置更改后刷新 View

Question

我有一个有 2 个 View \ Controller 的应用程序:

app.config(function ($routeProvider, $locationProvider)
{
    $routeProvider
    .when("/", {
        templateUrl: "/vw/managment",
        controller: 'managment-ctrl'
    })
    .when("/add", {
        templateUrl: "/vw/add",
        contoller: 'add-ctrl'
    })
    .otherwise({
        controller: function ()
        {
            window.location.replace('/errors/filenotfound');
        },
        template: "<div></div>"
    });

    $locationProvider.html5Mode(true);
});

路径 / 是我的“主页”，它显示了数据库中的项目列表。在此页面中，用户有按钮“添加”，可将页面重定向到 /add。 “添加”页面允许用户从数据库中添加项目。用户正在选择项目并单击“保存”。 “保存”按钮将项目保存到数据库并重定向回“主页”。

$scope.save = function()
{
    // Save login...
    $location.path("/");
};

问题

更改位置路径后， View 更改为“主页”，但仍显示添加新项目之前的项目。刷新页面会解决问题，当然不是解决办法...

我猜主页 View 是从缓存中加载的。我想强制 Angular 刷新 View 。

怎么做？

Answer 1

我在 this question 上找到了一些答案，这可能对你有用。您可以完全禁用缓存，因此始终从 cdn/服务器获取响应。

一种方法是修改请求中的缓存控制 header ，这样您的浏览器就不会缓存请求。

app.config(['$httpProvider', function($httpProvider) {
    if (!$httpProvider.defaults.headers.common) {
        $httpProvider.defaults.headers.common = {};
    }
    $httpProvider.defaults.headers.common["Cache-Control"] = "no-cache";
    $httpProvider.defaults.headers.common.Pragma = "no-cache";
    $httpProvider.defaults.headers.common["If-Modified-Since"] = "0";
}]);

---

另一种方法是禁用特定资源的缓存，在本例中是您的模板，因此只需将这些添加到模板的 html 文件的 header 即可。

<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Expires" content="Sat, 01 Dec 2001 00:00:00 GMT">