テーブルの列と行の両方を動的にバインドするのに問題があります。
2 つのモデルがあり、1 つがテーブルの列情報を保持しているとします。
var aColumnData = [
{
columnId : "col1"
},
{
columnId : "col2"
},
{
columnId : "col3"
},
{
columnId : "col4"
},
{
columnId : "col5"
}
];
そしてデータを持つもの:
var aData = [
{
col1 : "Row 1 col 1",
col2 : "Row 1 col 2",
col3 : "Row 1 col 3",
col4 : "Row 1 col 4",
col5 : "Row 1 col 5"
},
{
col1 : "Row 2 col 1",
col2 : "Row 2 col 2",
col3 : "Row 2 col 3",
col4 : "Row 2 col 4",
col5 : "Row 2 col 5"
}
];
次に、モデルを設定します。
var oModel = new sap.ui.model.json.JSONModel();
oModel.setData({
columns : aColumnData,
rows : aData
});
次に、ビューにテーブルを作成します。
var oTable = new sap.ui.table.Table();
var oColumnTemplate = new sap.ui.table.Column({
label : "{columnDesc}",
template : new sap.ui.commons.TextView().bindProperty("text", "<this_should_be_dynamic_but_how?>")
});
oTable.bindColumns("/columns", oColumnTemplate);
oTable.bindRows("/rows");
私を悩ませているのは、TextView テンプレートの現在の列へのバインドです。これは動的(「col1」、「col2」など)であり、その場で実行する必要があります-とにかくそれがバインディングの目的であると思います-しかし、私はそれを機能させることができません...
シンプルで些細なものが欠けていると思いますが、今は少し迷っています...どんな助けも大歓迎です!
==============================
編集:列配列を反復処理し、addColumn() メソッドを使用して動作するようにしました:
jQuery.each(aColumnData, function(i, v) {
oTable.addColumn(new sap.ui.table.Column({
label : v.columnDesc,
template: new sap.ui.commons.TextView().bindProperty("text", v.columnId)
}));
});
...しかし、 bindColumns() / bindRows() アプローチを使用した、よりクリーンなアプローチがあることを望んでいました: