1

我正在使用适用于 Windows 8 的 javascript/HTML 创建一个应用程序,它基本上显示从 html 文件中提取的文本。

我正在使用 data.js 文件来组织组和项目。属性之一是“url”,它存储包含应用程序主要内容的 html 页面的 url。

我想出了这段代码来从包含要显示的内容的 html 页面中检索 html 代码:

WinJS.UI.Fragments.renderCopy(url)
                  .done(function (fragment) {
                  return fragment;
});

如何为 data.js 中的数组中的每个项目运行此代码并绑定数据,以便内容来自 HTML 页面,标题/标题来自 data.js 文件?

如果我造成任何混乱,我深表歉意。我将不胜感激任何帮助。

谢谢。

4

1 回答 1

1

假设您想坚持 data.js 的布局而不是创建自己的数据类,我会为列表视图使用自定义渲染器。

像这样的东西...

var customRender = WinJS.Utilities.markSupportedForProcessing(function (itemPromise) {
    var currentItem = {};

    return itemPromise.then(function (item) {
        currentItem = item;
        var myDiv = document.createElement("div");
        return WinJS.UI.Fragments.renderCopy("/html/1_BasicFragmentLoad_Fragment.html", myDiv)
    })
    .then(function (fragment) {
        var itemTemplate = WinJS.Utilities.query('.itemtemplate')[0];
        currentItem.data.title = fragment.innerHTML; 

        return itemTemplate.winControl.render(currentItem.data);

    });
}

);

在此示例中,我将 html 片段的内容绑定到 data.js 中给定项目的标题。您将需要更新 itemtemplate 并将 title 元素绑定到 innerHTML 而不是 textContent。

<h4 class="item-title" data-win-bind="innerHTML: title"></h4>

您还需要将自定义渲染器分配给列表视图。您可以在 HTML 标记中执行此操作,或者只需将 groupItems.js 中的模板 js 更改为此...

 listView.itemTemplate = customRender;

如果您要创建自己的数据类,您可能希望将来自客户渲染器的承诺链放入类构造函数中,从而消除对客户渲染器的需要。

于 2012-08-19T16:16:38.810 回答