2016-12-21 5 views
0

У меня есть следующие JSON:Как связывании сложный JSON в таблицу

[ 
{ Hour:"01:00:00", 
    Name: "Den", 
    Agent:[ 
      {Slot : 1,Enabled : 1}, 
      {Slot : 2,Enabled : 1}, 
      {Slot : 3,Enabled : 1}, 
      {Slot : 4,Enabled : 1}, 
      {Slot : 5,Enabled : 1}, 
      {Slot : 6,Enabled : 1}, 
      {Slot : 7,Enabled : 1}, 
      {Slot : 8,Enabled : 1}, 
      {Slot : 9,Enabled : 1} 
     ] 
    } 
]... 

Мне нужно создать таблицу, которая перечисляет «Час» в колонке и других столбцах список их с объектом «Агентом»

Пример:

________________________________________________________ 
| Hour  | Slot 1 | Slot 2 | Slot 3 | Slot 4 | Slot 5 | 
--------------------------------------------------------- 
| 10:00:00 | 1  | 2  | 3  | 4  | 5  |... 

Создать таблицу, но загружать только время и полный "Агент" объект:

Таблица:

oTable.addColumn(new sap.ui.table.Column({ 
       label: new sap.ui.commons.Label({text: "Hour"}), 
       template: new sap.ui.commons.TextView({text: "{Hour}"}), 
       width : '125px' 
      }) 
    ); 

for(var i; i < 9; i++){ 
     oTable.addColumn(
        new sap.ui.table.Column({ 
         label: new sap.ui.commons.Label({text: "Slot "+i}), 
         template: new sap.ui.core.Icon({ 
         src: { 
          path : "Agent/", 
            formatter: function(v) { 
             if (v != null) { 
              if(v.Enabled == 1){ 
              return "sap-icon://save"; 
              }else{ 
              return "sap-icon://future"; 
              } 
             } 
            } 
         }, 
         size: "20px", 
        color: { 
         path : "Agent/", 
          formatter: function(v) { 
           if (v != null) { 
            if(v.Enabled== 1){ 
            this.attachEvent("press",function(oEvent)   {Alert("green")}) 
            return v.Slot != -1 ? "#f08e00" : "green" 
            }else{ 
            this.attachEvent("press",function(oEvent) {Alert("#bfbfbf")}) 
            return "#bfbfbf" 
            } 

           } 
         } 
        }, 
        hoverColor: "black", 
        activeColor: "black", 
        width : "100%", 
        }), 
         width: "70px" 
       }) 
       ); 
      } 
    } 

Любая идея, как это сделать? Мне пришло в голову «i» как «Агент/i», оно работает, но когда таблица позволяет «Прокрутить», она возвращает, чтобы визуализировать строки и беспорядок событиями с помощью значков:/

+0

u может создать один массив с требуемыми полями, затем передать его в таблицу. Тогда вы можете это получить. –

+0

Не могли бы вы привести мне пример: /? –

+0

Относительным путем будет: «Агент» + i. Я не столкнулся с проблемой прокрутки, о которой вы говорили, и были отображены правильные значки. Можете ли вы проверить, имеет ли ваша версия UI5 проблему с прокруткой с помощью SAPUI5 CDN? –

ответ

0

Вы имеют право использовать "Agent/"+i в качестве пути привязки.

Но вы не можете прикреплять обработчики событий внутри форматировщиков. При инициализации значка необходимо связать один раз с событием. Функция eventhandler снабжена объектом события, содержащим ссылку на экземпляр значка, который был нажат. с этим вы можете получить контекст привязки, который должен быть строкой. Снова используйте i, чтобы получить объект Column.

function createEventHandler(column){ 
    return function(oEvent) { 
     var context = oEvent.getSource().getBindingContext(); 
     var v = context.getProperty("Agent/" + column); 
     if (v){ 
     if (v. Enabled) { 
      Alert("green"); 
     } else { 
      Alert("#bfbfbf"); 
     } 
     } 
    } 
}; 
for(var i; i < 9; i++){ 
     oTable.addColumn(
        new sap.ui.table.Column({ 
         label: new sap.ui.commons.Label({text: "Slot "+i}), 
         template: new sap.ui.core.Icon({ 
         src: { 
          path : "Agent/"+i, 
            formatter: function(v) { 
             if (v != null) { 
              if(v.Enabled == 1){ 
              return "sap-icon://save"; 
              }else{ 
              return "sap-icon://future"; 
              } 
             } 
            } 
         }, 
         size: "20px", 
        color: { 
         path : "Agent/"+i, 
          formatter: function(v) { 
           if (v != null) { 
            if(v.Enabled== 1){ 
            return v.Slot != -1 ? "#f08e00" : "green" 
            }else{ 
            return "#bfbfbf" 
            } 

           } 
         } 
        }, 
        hoverColor: "black", 
        activeColor: "black", 
        width : "100%", 
        press: createEventHandler(i) //create a closure over the current value of i 
        }), 
         width: "70px" 
       }) 
       ); 
      }