$ http.get不反映数据库更改

Question

我有一个运行AngularJS的ASP.NET项目，该项目正在访问使用数据库的WCF服务。 这是一个简单的CRUD界面，带有一个表，该表显示数据库数据以及用于添加，编辑和删除数据的选项。 用户添加（即： $http.post ），编辑（即： $http.put ）或删除条目（即： $http.delete ）之后，我的控制器调用$http.get并使用它来更新表。 所有请求都使用“承诺”结构，并且会捕获错误。

有时，在发出请求后，表在更改后将不会更新。 我已经检查过，并且从get请求中检索到的数据不包括更改。 但是，如果我重新加载页面，将显示更改。 为什么会发生这种情况，为什么只有有时呢？ 在post / put / delete请求和获取请求之间是否需要延迟或有所不同？ 这是服务器还是客户端问题？ 提前致谢！

编辑1

在更新失败的过程中检查chrome dev tools网络中的实际请求时，我发现将先调用两次create / delete / update服务，然后再调用GET请求。 第一个始终是OPTIONS请求，其次是实际的POST / DELETE / PUT请求。 早先，为了使这些服务与我的界面一起使用，我必须使用以下内容修改服务Global.asax.cs文件：

protected void Application_BeginRequest(object sender, EventArgs e)
{
        HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");
        if (HttpContext.Current.Request.HttpMethod == "OPTIONS")
        {
            HttpContext.Current.Response.AddHeader("Cache-Control", "no-cache");
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Methods", "GET, POST, DELETE, PUT");
            HttpContext.Current.Response.AddHeader("Access-Control-Allow-Headers", "Content-Type, Accept");
            HttpContext.Current.Response.AddHeader("Access-Control-Max-Age", "1728000");
            HttpContext.Current.Response.End();
        }
}

问题可能在这里。 有任何想法吗？

编辑2

我的控制器中的保存功能：

$scope.save = function () {
    // Store user inputs
    var Map = {
        Id: $scope.Id,
        Channel: $scope.Channel,
        SubChannel: $scope.SubChannel,
        ChannelStatus: $scope.ChannelStatus,
        MappedStatus: $scope.MappedStatus
    };
    var post = CRUD_AngularJS_RESTService.post(Map);
    post.then(function (pl) {
        // Clear input forms
        ClearModels();
        $scope.ResultMessage = "New entry " + pl.data.Id + " added";
        $scope.AddEntry = false;
        // Re-populate table with new data
        GetFullMap();
    },
        function (err) {
            console.log("Error: ", err);
        });
};

GetFullMap（）是控制器中的另一个函数：

function GetFullMap() {
    var get = CRUD_AngularJS_RESTService.getFullMap();
    get.then(function (pl) {
        console.log("here ", pl.data);
        // Display map data in table
        $scope.Maps = pl.data;
        console.log($scope.Maps);
    },
        function (errorPl) {
            $scope.ResultMessage = "Error loading map";
            console.log("Error occurred while retrieving map ", errorPl);
        });
}

在Services.js中，post函数：

// Create new record
this.post = function (Map) {
    var request = $http({
        method: "post",
        url: "http://localhost:63647/Services.svc/rest/MapCreate",
        data: Map
    });
    return request;
}

同样在服务中，get函数：

this.getFullMap = function () {
    return $http.get("http://localhost:63647/MerchantServices.svc/rest/FullMapRead");
};

Answer 1

您使用哪个浏览器？

旧的ie版本（ie9）具有积极的缓存策略。 有时它将缓存您的get http请求...

您将必须在服务器响应的标头中设置no-cache参数，或者仅向每个请求添加一个timestamp参数（以使每个请求都不同）。

HTTP：// myContext /为myService时间戳= 1350387905444

Answer 2

不知道为什么会这样，但是这种解决方法似乎可以解决问题，我只是在调用GetFullMap（）之前添加了一点延迟：

$scope.save = function () {
    // Store user inputs
    var Map = {
        Id: $scope.Id,
        Channel: $scope.Channel,
        SubChannel: $scope.SubChannel,
        ChannelStatus: $scope.ChannelStatus,
        MappedStatus: $scope.MappedStatus
    };
    var post = CRUD_AngularJS_RESTService.post(Map);
    post.then(function (pl) {
        // Clear input forms
        ClearModels();
        $scope.ResultMessage = "New entry " + pl.data.Id + " added";
        $scope.AddEntry = false;
        // Re-populate table with new data
        $timeout(GetFullMap, 100);
    },
        function (err) {
            console.log("Error: ", err);
        });
};

另外，请务必在app.controller函数中提供$ timeout：

app.controller("CRUD_AngularJS_RESTController", function($scope, CRUD_AngularJS_RESTService, $timeout)
{
     ...
});