CODEWITHSUNDEEP
javascriptwindows-store-apps
Francesco Bonizzi
Francesco Bonizzi

Reputation: 5302

How to bind an array to a ListView

I know how to parse with Json and bind a file like this to a listview:

[
{
    "key": "Arthur Schopenhauer",
    "numeroFrasi": 3,
    "foto" : "images/TEST.jpg",
},
{
    "key": "Nietzsche",
    "numeroFrasi": 1,
    "foto" : "images/TEST.jpg",
},
.........

But I can't understand nor find on Web how to bind just every "frasi" (that is an array) in a file like this:

[
{
    "key": "Arthur Schopenhauer",
    "numeroFrasi": 3,
    "foto" : "images/TEST.jpg",
    "frasi": [
        "Fras1",
        "Frase 2 schopenahuer",
        "Frase 3 schopenhahuer"
    ]
},
{
    "key": "Nietzsche",
    "numeroFrasi": 1,
    "foto" : "images/TEST.jpg",
    "frasi": [
        "Frase 2 nietzsche",
        "Frase 3 nietzsche"
    ]
},
...............

My Object isn't an array, but it is definied like this form a txt file parsed with Json:

This is the generic definition:

 (function () {
"use strict";

var list = new WinJS.Binding.List();
var groupedItems = list.createGrouped(
    function groupKeySelector(item) { return item.group.key; },
    function groupDataSelector(item) { return item.group; }
);


WinJS.xhr({ url: "/data/frasi.txt" }).then(function (xhr) {
    var items = JSON.parse(xhr.responseText);

    // Add the items to the WinJS.Binding.List
    items.forEach(function (item) {
        list.push(item);
    });
});

Then this is the specific definition (because when I navigate to my page, I select just an "item", so only one "key, "numeriFrasi", "foto", "frasi":

 WinJS.UI.Pages.define("/pages/itemDetail/itemDetail.html", {

    ready: function (element, options) {
        item = options && options.item ? Data.resolveItemReference(options.item) : Data.items.getAt(0);

"resolveItemReference" gets one item from all the items created

Upvotes: 4

Views: 450

Answers (1)

Mohsen
Mohsen

Reputation: 65785

Strip out frasis to an Array first. You can use underscore.js

frasis = YOUROBJECT.map(function(el){return el.frasi;});
frasis = _(frasis).faltten();

Then use it to build your ListView

Upvotes: 3

Related Questions