为了证明这个问题,我将解释我想要实现的目标.我正在使用AngularUI日历创建一个预订系统,问题是当事件数量增加时(100个事件,日历将需要几分钟来绑定数据),日历的性能开始迅速下降.由于我每次用户更改视图(周,月,日,上一个,下一个等等)时都会通过发送
AJAX请求来尝试从后端获取数据,这是我开始时有问题.
正如在AngularUI Calendar网站上建议的那样,我可以使用这个函数：$scope.eventsF = function(start,end,timezone,callback){…}并将它添加到$scope.eventSources中,它将在每个上面调用查看开关.我将$scope.eventsF添加到我的$scope.eventSources,但它从未更新过.
这是示例(获取所有数据,并且它正在工作)：
$scope.mainEvents = []; //To initiate the event source
Event.getEvents().then(function (events) { // Event is a factory
if (events) { //Checking if I have events
// If I try: $scope.mainEvents = events; the $scope.eventSources won't update
angular.forEach(events,function(value) {
this.push(value);
},$scope.mainEvents);
} else {
// Tell the user no events to render...
}
},function (error) {
console.log(error);
});
$scope.eventSources = [$scope.mainEvents,$scope.draftEvents];
现在我更改了Event.getEvents()以获取两个参数作为视图的开始日期和结束日期,将它们发送到后端,并再次以json的形式检索数据(工作正常,我安慰了它).
这是代码(我尝试了两种方式)：事件正在渲染,但$scope.eventSources并未在这两种方式中进行更新.
第一：
$scope.mainEvents = function (start,callback) {
var s = start.format('YYYY-MM-DD'),e = end.format('YYYY-MM-DD');
Event.getEvents(s,e).then(function (events) {
$scope.mainEvents = []; //even tried $scope.eventSources.mainEvents
if (events) {
angular.forEach(events,function (value) {
this.push(value);
},$scope.mainEvents); //event tried $scope.eventSources.mainEvents
callback($scope.mainEvents);
}
},function (error) {
console.log(error);
});
};
$scope.eventSources = [$scope.mainEvents,$scope.draftEvents];
第二：
$scope.eventsF = function (start,e).then(function (events) {
$scope.mainEvents = [];
if (events) {
angular.forEach(events,$scope.mainEvents);
callback($scope.mainEvents);
}
},$scope.draftEvents,$scope.eventsF];
我希望这很清楚.
我能想到的最简单的方法是在$scope.eventsF结尾处将事件源重新分配给$scope.eventSources.以下代码基于您的第二个选项.干杯.
$scope.mainEvents = [];
$scope.draftEvents = [];
$scope.eventsF = function (start,callback) {
var s = start.format('YYYY-MM-DD'),e = end.format('YYYY-MM-DD');
Event.getEvents(s,e).then(function (events) {
$scope.mainEvents = [];
if (events) {
angular.forEach(events,function (value) {
this.push(value);
},$scope.mainEvents);
// Re-assign event sources
$scope.eventSources = [$scope.mainEvents,$scope.eventsF];
// Assume that 'events' is an array with 5 elements.
// console.log($scope.eventSources) will produce :
// Array [ Array[5],Array[0],app</$scope.eventsF() ]
callback($scope.mainEvents);
}
},function (error) {
console.log(error);
});
};
$scope.eventSources = [$scope.mainEvents,$scope.eventsF];
// console.log($scope.eventSources) will produce :
// Array [ Array[0],app</$scope.eventsF() ]
编辑
我已经更新了上面的代码,以显示我在哪个部分测试了$scope.eventSources.你能否请说明你希望$scope.eventSources更新的示例代码的哪一部分？
