Question

我想连接到Web服务并在WinJS ListView中显示结果。 Web服务返回JSON。到目前为止，我有这个标记：

    <div id="mediumListIconTextTemplate" data-win-control="WinJS.Binding.Template">
            <div>
                <h4 data-win-bind="innerText: title"></h4>
            </div>
    </div>

    <div id="basicListView" data-win-control="WinJS.UI.ListView"
        data-win-options="{itemDataSource : DataExample.itemList.dataSource, 
        itemTemplate: select('#mediumListIconTextTemplate')}">
    </div>

以下是我认为我需要在JS中做的事情：

使用WinJS.xhr从Web服务获取JSON数据。
从返回的JSON
使用WinJS.Binding.List从阵列

我错过了什么？我在哪里拨打WinJS.Binding.processAll(my_listview, data_list)？

Answer 1

您无需致电WinJS.Binding.processAll(my_listview, data_list).

我假设您使用的是单页导航模型，因此在页面的ready事件处理程序中，您将执行以下操作：

var page = WinJS.UI.Pages.define("/pages/home.html", {
        ready: function (element, options) {

            WinJS.xhr({url:'http://someservice.com'}).then(
                function(response) { 
                    var json = JSON.parse(response.responseText);
                    var list = new WinJS.Binding.List(json.results); // or whatever array you are binding too 
                    DataExample.itemList = list; // or however you want to get the list into DataExample.itemList
                },
                function(error) {
                    //handle error 
                }
            );
        }

就是这样。 default.js将处理整个页面的processAll（），让WinJS魔术为你完成工作。

您可以在http://slickthought.net/post/2012/08/20/Windows-8-and-HTML-Part-6-Displaying-Data-with-WinJS-ListView.aspx找到一个简单的示例。您也可以在此处按照ListView快速入门http://msdn.microsoft.com/en-us/library/windows/apps/hh465496.aspx

进行操作

如果您没有使用单页模型，那么在default.js上的激活处理程序内部，您只需添加上面的代码，在WinJS.UI.processAll()

返回的承诺内执行

如何将WinJS ListView绑定到Web服务？

1 个答案: