0

我正在创建要绑定到 WinJS.UI.ListView 的项目列表。项目创建如下:

var cells = [];

for (var i = 0; i < 2; i++) {
    for (var j = 0; j < 2; j++) {
        var cell = {
            location: { x: i, y: j }
        };

        cells.push(cell);
    }
}

此列表绑定到 WinJS.UI.ListView

<div id="itemTemplate" data-win-control="WinJS.Binding.Template">
    <div style="width: 150px; height: 150px; margin: 10px;" data-win-bind="-ms-grid-column: location.y; -ms-grid-row: location.x ">
        <h2 data-win-bind="innerText: location.x"></h2>
        ,
        <h2 data-win-bind="innerText: location.y"></h2>
    </div>
</div>

<div data-win-control="WinJS.UI.ListView" data-win-options="{ 
        itemDataSource : Data.itemList.dataSource,
        itemTemplate: select('#itemTemplate'),
        layout: {type: WinJS.UI.GridLayout} }"
    style="width: 100%; height: 100%">
</div>

ListView 的布局设置为“ WinJS.UI.GridLayout ”,因此我想将“ -ms-grid-column ”和“ -ms-grid-row ”样式属性绑定到位置对象的 X 和 Y 属性项目模板。将项目绑定到列表就像一个魅力,但绑定列和行属性会引发异常。

这里有什么问题?谁能指出我正确的方向?

4

1 回答 1

0

-ms-grid-columnand-ms-grid-row不是 a 的属性divdata-win-bind也不会绑定 CSS 属性——它会绑定 HTML 属性。您可以改为尝试以下操作:

<div data-win-bind="style: location SomeLocationToStyleConverter">

您必须构建一个初始化程序或转换器(在本例中名为SomeLocationToStyleConverter),它可以获取复杂的位置对象并返回样式属性的整个值

于 2013-07-01T00:40:52.013 回答