0

我目前正在尝试使用列表视图来驱动 Windows 应用商店应用程序 (HTML/JS) 中单独 div 的内容。

我有一个简单的函数，我在列表视图的“oniteminvoked”处理程序中调用它。

方法调用

MyApp.Util.addClassById(q(".item"), item.itemId, "selected");

（其中 item.itemId 是我新选择的项目，'q' 是 WinJS.Utilities.query 的别名）

方法声明

function addClassById(elements, selectedId, className) {

    elements.forEach(function (el) {

        var id = parseInt(el.attributes['data-id'].value, 10);

        if (id === selectedId) {
            util.addClass(el, className);
        }
        else {
            util.removeClass(el, className);
        }
    });
}

在加载我的列表视图并且我正在选择新项目后，这将按预期工作。它不加载的地方是当我尝试在我ready的相关页面的函数期间调用它时。

当我进行调试时，似乎我对列表中项目的查询在 pagesready函数期间没有返回任何内容，所以我假设此时尚未呈现列表并且 DOM 查询没有返回任何内容。

所以问题是，在呈现后选择项目（或在列表视图上执行操作）的推荐方法是什么？

我认为它们可能是一个“afterrender”类型的事件，我可以在其中调用该函数，但我似乎找不到任何有效的东西。

有任何想法吗？

4

2 回答 2

1

我知道的最好的方法是捕获onloadingstatechanged事件并等到 ListView 被“加载”。您可以通过访问我在http://codefoster.com/loadingstates上的博客文章了解如何

于 2013-07-22T20:22:09.180 回答
0

查看这段代码，它遍历列表中的所有数据并将其与另一个列表进行比较，以选择与数据中的 id 匹配的每个元素。

如果你使用element.querySelector而不是document.getElementById你可以在你的准备功能中使用它。

var itemList= [
{ id: "11", name:"value1" }, 
{ id: "12", name:"value2" }
]

    var listView = document.getElementById("listViewOwners").winControl;

    var itemsInFavList = listView.itemDataSource.getCount()._value;
    for (var i = 0; i < itemsInFavList; i++) {
        var item = listView.itemDataSource.itemFromIndex(i);

        if (compareArray(itemList, item._value.data).length > 0)
        {    
            listView.selection.add(item._value.index);
        }
    }
}

//this function uses the filter function to check 
//if the element from the listView is contained in the data list
function compareArray(itemList, data){

    return itemList.lineOwners.filter(
        function (subitem) {
            return subitem.id === data.key
        });
    }
于 2013-12-13T09:05:31.547 回答