在Javascript中为Sencha Touch Ext.ux.TouchCalendar更改对象数组结构

Changing an array of objects structure in Javascript for Sencha Touch Ext.ux.TouchCalendar

本文关键字：对象 数组 结构 TouchCalendar ux 中为 Javascript Sencha Touch Ext      更新时间：2023-09-26

我正在构建一个Sencha Touch应用程序，它利用了很棒的日历插件https://github.com/SwarmOnline/Ext.ux.TouchCalendar，但是，为了利用事件功能，需要一些自定义实现。

我已经将事件模板绑定到一个存储，该存储从服务器获取数据。它按计划工作，但问题是插件查找存储中的所有记录，并将每个记录计数为事件(因为在事件模型中，它查找"日期"作为开始和结束点)。所以每天看起来都有一个事件，即使那些没有"项目"的是空白的，参见:http://cl.ly/image/3j461O2L2Y1k。我只想显示带有"items"的事件

我从服务器返回的数据以以下格式(许多天没有"项"):

 [
  {
  "day":28,
  "iscurrentmonth":false,
  "issunday":false,
  "date":"2013-05-28",
  "items":[
     {
        "id":134513,
        "title":"Subject",
        "typeid":3,
        "typename":"Essay",
        "author":"Bryan Fisher",
        "classname":"English 9A",
        "classid":344499,
        "courseid":60555
     },
     {
        "id":134485,
        "title":"Subject",
        "typeid":3,
        "typename":"Essay",
        "author":"Bryan Fisher",
        "classname":"English 10",
        "classid":344500,
        "courseid":60555
     }
  ]
 }
]
因此，我必须将数据数组的结构更改为以下格式: 
[
  {
  "date":"2013-05-28",
  "id":134513,
  "title":"Subject",
  "typeid":3,
  "typename":"Essay",
  "author":"Bryan Fisher",
  "classname":"English 9A",
  "classid":344499
 },
 {
  "date":"2013-05-28",
  "id":134485,
  "title":"Subject",
  "typeid":3,
  "typename":"Essay",
  "author":"Bryan Fisher",
  "classname":"English 10",
  "classid":344500
 }
]

如何更改原始对象以匹配新格式?(将"date"插入"items"节点)?

我完全接受像underscore.js这样的东西

Thanks in advance

也许我想多了…

A bit of A hack…

在TouchCalendarEvents.js中，我添加了以下方法来检查空事件div 
hideOthers: function(){
    var bar = $('.event-bar');
    for (var i = 0; i < bar.length; i++){
        var allBars = bar[i];
        if (allBars.innerHTML == ''){
            console.log('number ' + i + 'is Empty!' );
            allBars.remove();
        }
    }
},
并在refreshEvents 中调用它
refreshEvents: function(){
    // scroll the parent calendar to the top so we're calculating positions from the base line.
    if(this.calendar.getScrollable()){
        this.calendar.getScrollable().getScroller().scrollTo(0,0);
    }
    this.removeEvents();
    this.getViewModeProcessor().generateEventBars(); // in turn calls this.renderEventBars(this.eventBarStore);
    this.createEventWrapper();
    this.hideOthers();

    if (this.getAllowEventDragAndDrop()) {
        this.createDroppableRegion();
    }
},

目前工作得很好!

相关文章：