1

不太清楚如何表达我遇到的这个问题，所以我希望这是有道理的。

我想创建一个列表视图，并设置了所有数据绑定并创建了一个模板等，因此它可以很好地显示数据，但是我显示的每个列表视图图块上的元素之一是实时时钟。问题实际上是如何在不重绘整个列表视图的情况下更新所有列表视图对象。

我目前唯一的工作方法是每秒更新绑定到它的数据，以及我想显示的时间，这有效，但它重绘了整个列表视图。这很昂贵，并且会触发动画（可以取消，但不能完全监听动画开始事件）

谢谢！

4

2 回答 2

0

一种方法是为您的列表视图使用 JavaScript 模板。像往常一样将数据绑定到列表视图，但向数据模型添加一个名为时钟的属性。对于要呈现时钟的数据项，将其值设置为 true。不是在 HTML 中定义模板，而是在 JavaScript 中定义模板（您可以在此处查看如何执行此操作 - http://msdn.microsoft.com/en-us/library/windows/apps/jj585523.aspx）在 JavaScript 模板中然后，您可以添加一些逻辑来确定图块是否应该是基于绑定属性的时钟以及是否创建时钟模板：

function itemTemplateFunction(itemPromise) {

        return itemPromise.then(function (item) {

            if (item.data.clock == true) {
                //TODO: Append HTML and JS for your clock object
                //TODO: Perhaps set up a setInterval timer to tick your clock along.

            }
            else {
                //TODO Add the regular template Code, example below
                var div = document.createElement("div");

                var img = document.createElement("img");
                img.src = item.data.picture;
                img.alt = item.data.title;
                div.appendChild(img);

                var childDiv = document.createElement("div");

                var title = document.createElement("h4");
                title.innerText = item.data.title;
                childDiv.appendChild(title);

                var desc = document.createElement("h6");
                desc.innerText = item.data.text;
                childDiv.appendChild(desc);

                div.appendChild(childDiv);

                return div;

            }
        })
    };
于 2012-11-15T22:25:22.203 回答
0

给定对您的数据对象的访问权限（我假设您在想要这样做的时候仍然拥有），一个模板，例如：

<div data-win-control="WinJS.Binding.Template" id="yourTemplate">
    <div data-win-bind="textContent: timestamp"></div>
</div>

在您希望更改项目的时钟时，通过它们并更新timestamp属性，列表视图将更新。例如

var item = getItemToUpdateFromSomewhere();
item.timestmap = "2 O'clock";
于 2012-11-16T00:16:29.337 回答