尝试使用ng-grid和ASP创建简单的工作应用程序。净MVC。客户端:
var app = angular.module('TestApp', ['ngGrid'])
app.controller('MainController', function ($scope, $http) {
$scope.addresses = []
$scope.filterOptions = {
filterText: "",
useExternalFilter: true
};
$scope.update = function () {
$http.get('/Home/GetData', {
params: { filter: $scope.filterOptions.filterText }
})
.then(function (result) {
$scope.addresses = result.data
//alert(JSON.stringify(result))
})
$scope.$apply()
}
$scope.update()
$scope.gridOptions = {
data: 'addresses',
headerRowHeight: '50',
columnDefs: [
{ field: 'country', headerCellTemplate: '<table><tr><td>Country</td></tr><tr><td ng-controller="MainController"><input type="text" placeholder="" ng-model="filterOptions.filterText"/></td></tr></table>' },
{ field: 'city'},
{ field: 'street'},
{ field: 'house'},
{ field: 'zipcode'},
{ field: 'datec'}
]
};
$scope.$watch('filterOptions', function (newVal, oldVal) {
if (newVal !== oldVal) {
$scope.update()
}
}, true);
我可以看到我得到正确的数据:
public ActionResult GetData(string filter)
{
var query = from c in db.Addresses where c.country.Contains(filter) select c;
return Json(query.ToList(), JsonRequestBehavior.AllowGet);
}
在我的代码中,.then回调被调用,我可以浏览所有返回的adin数据地址。然而,网格中没有显示任何内容。控制台中没有出现错误
对于遇到此问题的其他人,这里有更多人记录了此问题
问题,我认为(因为我从来没有时间深入挖掘模块,看看发生了什么),是任何缓存的对象引用将被重用与他们的模板表示。我无法通过仅更改几个对象来重现问题,但在我通过过滤/排序管道处理来自ui-grid的输入数据后,这种情况也发生在我身上。最后,我将得到一个包含新对象和旧对象(引用)的数组,而且,对象是变异的。
最后,当我遇到这个问题时,我使用了angular.copy
$scope.uiGridOptions.data = angular.copy(theNewResultedArray);
更像是一种变通方法,要小心,因为它有一些性能影响,只有在数据没有成功更新时才应该限制这个用例。
顺便说一下。对我有用的(我得到了同样的错误)是调用gridApi.core.refresh ()
这是导致IE刷新网格的原因,即使在模态上更新了双向绑定数据。
我在使用Angular 1.3的测试版时也遇到过这个问题。
我通过更新到最新版本(1.3.10)修复了它。