AngularJS UI日历不更新的日历事件 [英] AngularJS UI-calendar not updating events on Calendar
问题描述
我采用了棱角分明的UI日历显示日历上的一些事件。这些事件显示在日历的罚款。但是，当我更新任何事件的细节，事件的细节实际上是修改，但不能修改日历显示。（如：启动）
I am using Angular UI-Calendar to show some events on the Calendar. The events are showing fine on the Calendar. But when I update any event's details, the event's detail is actually modified, but not modified on the Calendar display(eg: start).
起初，我修改了事件的细节后，我做了一个重新加载页面显示修改变化，它的工作too.In的方法，我只好空 $ scope.events = []; 阵列，这是我从数据库中检索条目后填写。
Initially, after I modified the event's details, I did a page reload to display modified changes and it worked too.In that method, I had empty $scope.events = []; array, which I filled after retrieving entries from DB.
但现在，我想避免页面重载。因此，一旦该事件的详细信息是从模式窗口修改，我清楚的内容 $ scope.events 使用数组 $ scope.events = []; ，然后使用API调用，我再次填充新事件 $ scope.events 阵列。这是因为列表视图显示修改后的事件细节做工精细。但日历本身就说明旧条目。例如，如果我更改启动从4月11日至4月13日，日历显示4月11日，而列表视图显示了修改后的数据即4月13日的事件。使用页面重载，纠正了在修改日期（4月13日）显示在该事件即。
But now, I want to avoid that page reload. So, once the event's details are modified from modal window, I clear the contents of $scope.events array using $scope.events = []; and then using API call, I fill the new events again in $scope.events array. This is working fine as the List view shows the modified events details. But the Calendar itself shows old entries. e.g if I change start from 11 April to 13 April, the calendar shows event on 11 April whereas List views shows the modified data i.e 13 April. Using Page reload, corrects this i.e event is shown on modified date(13 April).
我如何能确保该事件在日历修改过没有重新加载页面？
How can I ensure that the event is modified on Calendar too without a Page reload ?
我试过 calendar.fullCalendar（'渲染'）; 从数据库获取新项目后，但它并没有解决问题。
I tried calendar.fullCalendar('render'); after fetching new entries from DB, but it does not solve the Problem.
下面是一些codeS：
Here are some codes :
起初我这样做是将数据发送到数据库，然后没有重新加载页面检索更新的数据。 $ http.put（URL，送出数据）.success（功能（数据）{$ window.location.reload（）;}）;
Initially I did this to send data to DB and then did a page reload to retrieve updated data.
$http.put(url,senddata).success(function(data){$window.location.reload();});
现在我想避免的页面重载，所以我做了
Now I want to avoid the page reload, so I did
$http.put(url,senddata).success(function(data){//$window.location.reload();//sends modified data to server
$scope.events = []; //clear events array
$http.get(url2).success(function(data){ //fetch new events from server, and push in array
$scope.schedule = data;
for(var i=0;i<data.length;i++)
{
$scope.events.push({
idx: data[i].idx,
title: data[i].title,
description : data[i].description,
allDay: false,
start: new Date(data[i].start),
end: new Date(data[i].end),
});
calendar.fullCalendar('render'); //Tried even this, didn't work
}
});
以上code推压修改事件事件阵列可见的列表视图，但日历仍显示旧的事件，直到页面重新加载。
Above code pushes modified event in event array as visible in List view, but calendar still shows old event until page is reloaded.
推荐答案
尽量保持相同的数组实例。
Try maintaining the same array instance.
而不是做的：
$ scope.events = []
尝试：
$ scope.events.slice（0，$ scope.events.length）;
然后当你的服务器的请求回来，单独添加每个项目到现有阵列：
Then when your server request comes back, add each item individually to the existing array:
为（VAR I = 0; I＆LT; newEvents.length ++我）{
$ scope.events.push（newEvents [I]）;
}
我之所以认为这是因为你描述听起来像日历可能被抓着事件的旧列表。日历可能不知道更新其引用，所以而是让它保持相同的参考，但改变数组的内容。
The reason I suggest this is because what you're describing sounds like the calendar might be holding onto the old list of events. The calendar might not know to update its reference, so instead, let it keep the same reference but change the contents of the array.
这篇关于AngularJS UI日历不更新的日历事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
