2015-11-09 4 views
0

Я пытаюсь отобразить таблицу (sap.m.table) с 2 столбцами (Роли, Пользователь). таблица получать данные из модели JSONModel:получить данные nestet JSONModel в sap.m.table

{ 
"roles":[ 
    { 
    "id":1, 
    "name":"Administrator", 
    "permissions":[ 
     { 
      "id":1, 
      "permissionUtilPermission":"CREATE_USER", 
      "description":"Create User", 
      "name":"Create User" 
     } 
    ], 
    "user":[ 
     { 
      "loginName":"admin1", 
      "firstName":"John", 
      "lastName":"Doe", 
      "id":1, 
      "active":true 
     }, 
     { 
      "loginName":"admin2", 
      "firstName":"Carmen", 
      "lastName":"Stiffler", 
      "id":2, 
      "active":true 
     } 
     ......... 
    ] 
    }, 
    { 
    "id":2, 
    "name":"User", 
    "permissions":[ 

    ], 
    "user":[ 
     { 
      "loginName":"user1", 
      "firstName":"Carlos", 
      "lastName":"Mayer", 
      "id":3, 
      "active":true 
     }, 
     { 
      "loginName":"user2", 
      "firstName":"Jonny", 
      "lastName":"Jefferson", 
      "id":4, 
      "active":true 
     }, 
     ....... 
    ] 
    } 
] 
} 

в представлении я создать таблицу с 2 столбцами и ColumnListItem в качестве шаблона. Этот шаблон содержит sap.m.Text и sap.m.FlexBox, у которых есть sap.m.Button как элемент.

В первом столбце должно отображаться «имя» «ролей». Во втором столбце должен быть отображен в Flexbox пределами кнопок и текст этих кнопок должен быть именами («LoginName») пользователя ролей

вид:

var oTable = new sap.m.Table('mRoleTable', { 
      width: '75%', 
      columns: [new sap.m.Column('', { 
          header: new sap.ui.commons.Label({ 
           text: '{i18n>admin.RoleTableHeaderRole}' 
           }) 
          }), 
         new sap.m.Column('', { 
          header: new sap.ui.commons.Label({ 
           text: '{i18n>admin.RoleTableHeaderUser}' 
          }) 
         })], 
      items: new sap.m.ColumnListItem('oRolesItemTemplateId', { 
       cells: [new sap.m.Text('item1Id', { 
          text: '{name}' 
          }), 
         new sap.m.FlexBox('item2Id', { 
          items: new sap.m.Button('userBtnId', { 
           text: '{user}' 
          }), 
       })] 
      }) 
     }); 

функция OnInit контроллера создает новый JSONModel и загружает данные из json-файла. после того, что модель устанавливается в таблице, и элементы связываются с «/ роли»

контроллер:

onInit: function() { 
var oView = this.getView(); 
var oController = this; 
var oModel = new sap.ui.model.json.JSONModel(); 
oModel.loadData('../model/rolemanagement.json'); 

oModel.attachRequestCompleted(oModel, function(e) { 
    if (e.getParameters().success) { 
     console.log('loading successful...'); 

     sap.ui.getCore().setModel(oModel); 

     var oMTable = sap.ui.getCore().byId('mRoleTable'); 
     oMTable.setModel(oModel); 

     var oRolesItemTemplate = sap.ui.getCore().byId('oRolesItemTemplateId'); 
     oMTable.bindAggregation("items", "/roles", oRolesItemTemplate); 
    } else { 
     console.log('. . . LOADING ERROR'); 
     console.log(e.getParameters().errorobject.statusText); 
    } 
}); 
} 

если я попробовать, это только дисплей это таблица, как это:

Role     User 
------------------------------------ 
Administrator  [object Object] 
User     [object Object] 

но то, что мне нужно, это таблица, как это:

Role     User 
------------------------------------ 
Administrator  admin1 admin2 
User     user1 user2 

здесь та же таблица для лучшего понимания:

Role      User 
_______________________________________________ 
---------------------------------------------- 
|     ------------------------ |<---ColumnListItem 
|     |      |<-|------FlexBox 
|Administrator  | --------- -------- | | 
|     | | admin1 || admin2 |<-|--|-------- Buttons (text: '/role/user/loginName') 
|     | --------- -------- | | 
|     ------------------------ | 
---------------------------------------------- 
---------------------------------------------- 
|     ------------------------ |<---ColumnListItem 
|     |      |<-|------FlexBox 
| User   | --------- -------- | | 
|     | | user1 || user2 |<-|--|-------- Buttons (text: '/role/user/loginName') 
|     | --------- -------- | | 
|     ------------------------ | 
---------------------------------------------- 

У кого-то есть решение для моей проблемы?

ответ

0

Взаимосвязь между ролью и пользователями в рамках этой роли является одним из родительского ребенка. Это подразумевает список в списке. Не могли бы вы подумать о принятии родительского дочернего шаблона, который имеет дело с этим сценарием. Затем вы должны выбрать роль, а затем представить ее пользователям. Hardcoding {user/0/loginName} вместо {user} предоставит вам первого пользователя (но вы, вероятно, знали это?) Мое личное мнение состояло в том, чтобы усыновить родительское дочернее древовидное (то есть реализовано через 2 представления, где второе представление передано выбранной ролью и отображает пользователей, сопоставленных с этой ролью).

Некоторых других незначительных точек (с наилучшей точки зрения практики), что я забирал в моем чтении и кодирование: использовать jQuery.sap.log.info( вместо console.log( и ... для совместимости, идущих вперед команду OpenUI рекомендует называющие модели, т.е. oMTable.setModel(oModel, "roles") , Это будет означать настройку привязок для включения именованной ссылки модели {roles>....}. (На всякий случай это имело для вас значение - подробности см. В документации по API.)

+0

спасибо за вашу помощь! Я не понимаю, как это сделать с 2 видами ... но я нашел другое решение, которое работает для меня :-) –

0

теперь я получил решение, которое работает отлично:

контроллер:

var oView = this.getView(); 
var oController = this; 

//load data for roles 
var oModel = new sap.ui.model.json.JSONModel(); 
oModel.loadData('../model/rolemanagement.json'); 

oModel.attachRequestCompleted(oModel, function(e) { 
    if (e.getParameters().success) { 
     jQuery.sap.log.info('loading roles model successful...');   

     sap.ui.getCore().setModel(oModel); 

     var oMTable = sap.ui.getCore().byId('mRoleTable'); 
     oMTable.setModel(oModel); 

    } else { 
     jQuery.sap.log.info('. . . LOADING ERROR'); 
     jQuery.sap.log.info(e.getParameters().errorobject.statusText); 
    } 
}); 

вид:

new sap.m.Table('mRoleTable',{ 
      width: '75%', 
      columns: [ 
       new sap.m.Column({width: '25%', header: new sap.m.Label({text: "Role"})}), 
       new sap.m.Column({ header: new sap.m.Label({text: "User"})}), 
      ], 
      items: { 
       path: "/", 
       template: new sap.m.ColumnListItem({ 
       cells: [ 
        new sap.m.Text({ text: "{roleName}" }), 
        new sap.ui.layout.Grid({ 
        content: {       
         path: 'users', 
         template: new sap.m.Button('tmpBtn',{        
          text: '{loginName}', 
          type: 'Transparent', 
          layoutData: new sap.ui.layout.GridData({ 
           span: "L2 M4 S5" 
          }) 
         }) 
        } 
        }) 
       ] 
       }) 
     } 
     }) 
Смежные вопросы