【问题标题】:Binding JSON string to ListView in Metro apps?在 Metro 应用程序中将 JSON 字符串绑定到 ListView?
【发布时间】:2012-08-16 11:52:46
【问题描述】:

我有一个 Metro 应用程序(HTML5 和 WinJS),我试图在其中显示服务数据。实际上,这里是从我的服务中检索 JSON 数据,但无法将此数据绑定到 listview 。任何人都可以给我一些工作示例。

谢谢。

【问题讨论】:

  • 您能否详细说明“无法将此数据绑定到列表视图”的含义?你有例外吗?您能否发布将 JSON 数据添加到所需 WinJS.Binding.list 并将其连接到 ListView 控件的代码?

标签: html data-binding microsoft-metro winjs


【解决方案1】:

您可以为此使用WinJS.xhr()。您可以在此链接https://msdn.microsoft.com/pt-br/library/windows/apps/br229787.aspx 上阅读更多相关信息,这是一个示例:

var path = "data/file.json";
function getData(path) {
    WinJS.xhr({ url: path }).then(
        function (response) {
            var json = JSON.parse(response.responseText);

            // Since this is an asynchronous function, you can't
            // return the data, so you can:
            // 1) retrieve the data to a namespace once the app loads.
            var list = new WinJS.Binding.List(json);
            Somenomespace.data = list;

            // 2) or do all the binding inside the function.
            var listView = document.getElementById("listViewID");
            listView.winControl.itemDataSource = list.dataSource;
        });
}

【讨论】:

    【解决方案2】:

    如果你使用内置的 JSON.parse(jsonString) 函数,你可以使用普通的 for 循环遍历内容,因为它是一个普通的对象并像往常一样添加它。只要记住处理或渲染数据。

    她是我在使用列表视图的搜索页面中的代码示例:

    var response = JSON.parse(data) ; 
    var originalResults = new WinJS.Binding.List();
    
    for (x in response) {
        originalResults.push(response[x]); 
    }
    
    this.populateFilterBar(element, originalResults); 
    this.applyFilter(this.filters[0], originalResults); 
    

    【讨论】:

    • 很难在手机上缩进代码......当我在电脑上时会修复
    • @谢谢 Sindre,这里 populateFilterBar,applyFilter&filters 的意思是?那些是 html 元素的 id?
    • 这些是微软提供的原始搜索模板中的方法。如果我没记错的话,基本上他们只是运行一个 WinJS.Binding.processAll
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-10-11
    • 1970-01-01
    • 1970-01-01
    • 2012-06-21
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多