使用代码中的模板实例化 WinJS.UI.ListView 时出错答案

【问题标题】：Error when instantiating WinJS.UI.ListView with template from code使用代码中的模板实例化 WinJS.UI.ListView 时出错
【发布时间】：2015-05-08 18:28:32
【问题描述】：

在创建包含WinJS.UI.ListView 的自定义 WinJS 控件的过程中，我试图允许用户传递模板的选择器。

但是，无论我是否像您期望的那样在 HTML 页面中“预先创建”了模板：

<div data-win-control="WinJS.Binding.Template"> <!-- ... --> </div>

如果我查询元素并从以下代码创建模板，也不会：

var template = new WinJS.Binding.Template(document.querySelector(selector));

当我开始实例化 ListView 并将模板元素本身（或其 winControl 属性）传递给 ListView 的 itemTemplate 选项时，如下所示：

new WinJS.UI.ListView(elem,  { itemTemplate: template.winControl });

我收到以下错误：

JavaScript 库代码即将在 ms-appx://microsoft.winjs.2.0/js/base.js 中的第 11562 行第 21 列捕获异常

0x800a01b6 - JavaScript 运行时错误：对象不支持属性或方法“_renderItemImpl”

我试图追溯它，但在base.js 中迷路了。希望其他人也遇到过这种情况。

注意：我已将我的解决方法作为答案。

【问题讨论】：

另外请注意，我从上面的 ListView 实例化示例中省略了其他选项，因为我认为它们与问题无关，但我使用的是 ListLayout 的布局、无 selectionMode 和静态 itemDataSource。
我很好奇，您使用什么选择器来引用模板？通常在模板
上使用 id 或类，并使用选择器引用它。
@KraigBrockschmidt-MSFT 当时我使用的是类名。我知道我能够很好地检索元素，因为我能够验证检索到的元素上的 winControl 属性。

标签： javascript windows-8 windows-8.1 winjs

【解决方案1】：

我能够开始工作的唯一解决方法是在代码中实例化模板，然后在实例化 ListView 时将函数传递给 itemTemplate 选项。关于此处预期内容的文档很少，但所有通过代码实例化 ListView 的演示都使用模板函数，所以我认为这是实现这一目标的唯一方法。

new WinJS.UI.ListView(elem,  {
    itemTemplate: function (promise) {
        return promise.then(function (item) {
            return resultsTemplate.render(item.data);
        });
    }
});

【讨论】：

【解决方案2】：

在您尝试使用 Binding.Template 之前，请确保它的声明性标记已被处理。您可以使用WinJS.UI.processAll() 处理声明性标记。

如果您以声明方式同时创建 ListView 和 Binding.Template，请确保 Binding.Template 首先出现在您的标记中，以便在 ListView 尝试使用它时完成处理。

Check out this sample 创建一个带有声明性标记的 ListView 和模板。

【讨论】：

对延迟回复表示歉意，但这对我也不起作用。我发布的解决方案仍然是唯一适合我的解决方案。