我有一个用Node.js和AngularJS构建的应用程序。我正在做简单的 CRUD 操作。在chrome中,一切正常,但是在Internet Explorer中,由于缓存,我必须手动刷新数据。
几个小时后,我找到了解决方案,但它仍然不能 100% 工作。例如:
- 在文本框中输入名称("Partner_name_1"),然后按
Add
- 什么也没发生
- 再次在文本框中输入名称("Partner_name_2"),然后按
Add
(或只是刷新页面) - 在下面的列表中出现("Partner_name_1")
- 。你可以从头开始重复
这是我的代码
视图:
form(name="AddPartner")
|Name:
input(type='text', name='name' ng-model="dataPartner.name")
button(type='add', ng-click="addPartner(dataPartner)")
| Add
table(style="width:100%")
tr(ng-repeat="partner in partnerList")
td
p {{ partner.name }}
td
button(type='remove', ng-click="removePartner(partner._id)")
| Remove
角度脚本:
var myApp = angular.module('myApp', ['ngRoute']);
myApp.config(['$routeProvider', '$httpProvider', function($routeProvider, $httpProvider) {
$httpProvider.defaults.headers.common['Pragma'] = 'no-cache';
}]);
myApp.controller("myCtrl", function($scope, $http, $timeout){
$scope.loadPartnersData = function () {
$http.get("/main/partner-list").then(function(result) {
$scope.partnerList = result.data.partnerList;
});
};
$scope.loadPartnersData();
var addPartner = '/main/addPartner'
var removePartner = '/main/removePartner'
$scope.addPartner = function(data) {
$http.post(addPartner, data)
.then(function(response) {
console.log(response);
$timeout($scope.loadPartnersData(), 5000)
});
};
$scope.removePartner = function(id) {
var data = {"id": id}
$http.post(removePartner, data)
.then(function(response) {
console.log(response);
});
$scope.loadPartnersData();
};
});
试试这个:
$scope.addPartner = function(data) {
$http.post(addPartner, data)
.then(function(response) {
console.log(response);
$scope.loadPartnersData();
});
};
你在 http post 承诺之外调用 loadPartnersData(),这导致它立即运行,可能是在后端实际处理添加之前。
将想要修复删除,它有同样的问题。