Question

// file.html

        <div id="RankingTemplate" data-win-control="WinJS.Binding.Template" >
            <h2>
                <span class="Number" data-win-bind="innerText:place"></span>

                <span id="ratingControlDiv"
                      data-win-control="WinJS.UI.Rating"
                      data-win-bind="winControl.averageRating: rating"
                      data-win-options="{maxRating:5,disabled:true}"></span>

                <label for="ratingControlDiv" data-win-bind="innerText : votes"></label>
                <span class="Name" data-win-bind="innerText : title"></span>
            </h2>
        </div>

        <div id="RankingList"
             data-win-control="WinJS.UI.ListView"
             data-win-options="{
                    itemDataSource : sourceData.itemRankingData.dataSource,
                    itemTemplate : RankingTemplate,
                    tapBehavior: 'none',
                    swipeBehavior : 'none',
                    layout: {type: WinJS.UI.ListLayout}
                }"></div>

// file.js

var dataRankingArray = [
    {
        place: 1,
        rating: 4.75,
        votes: "(2500000 votes)",
        title: "Marius"
    },
    {
        place: 2,
        rating: 4.5,
        votes: "(190 votes)",
        title: "Napolis"
    },
    {
        place: 3,
        rating: 3.8,
        votes: "(200 votes)",
        title: "Oliva Restaurant"
    },
    {
        place: 4,
        rating: 3.42,
        votes: "(215 votes)",
        title: "Tucano Coffe"
    },
    {
        place: 5,
        rating: 3.1,
        votes: "(197 votes)",
        title: "Robert's Coffe"
    }
];

var dataRankingList = new WinJS.Binding.List(dataRankingArray);

   var publicMembers =
    {

        itemRankingData: dataRankingList
    };
WinJS.Namespace.define("sourceData", publicMembers);

// screenshoots

当加载应用程序时，主页看起来像在之前的图像中，并且一切正常。

之前http://imgur.com/0BCpUeP

当我尝试从当前页面（主页）导航到导航控件的同一页面（主页）时，列表不会加载模板。结果显示在下一个图像中。

在http://imgur.com/rEoQLRd

之后

Answer 1

这个问题很可能是因为开箱即用的navigator.js不支持同页导航;新页面加载后，旧页面将卸载。两个更简单的修复方法是：

将页面初始化代码分离到单独的函数（例如，将其移出ready（）函数），而不是重新加载页面，只需调用初始化函数。
使用win8版本的navigator.js，我相信它有不同的行为。

如果您只是需要更新数据，可以使用这样的代码而不是重新加载页面：

var lv = document.getElementById("RankingList");
lv.itemDataSource = sourceData.itemRankingData.dataSource;

Windows商店js app导航控件导致数据绑定问题

1 个答案: