0

我有一个带有列表视图的 WinJS 应用程序，如果在列表视图完全加载之前在页面之间快速导航，则下一页显示列表视图，其中所有元素绑定为“未定义”。

假设我有一个带有“待办事项”的中心页面，该页面被过滤为仅显示 6 个项目，并且有一个标题导航到完整的“待办事项”页面，当显示中心页面但在它完全加载之前我单击“待办事项”页面的标题链接，然后应用程序转到“待办事项”页面，但项目显示在磁贴中的所有属性为“未定义”。

我使用 IndexedDB 作为我的数据存储。

我的主页代码如下所示：

WinJS.UI.Pages.define("/pages/home/home.html", {
    ready: function (element, options) {
        WinJS.Utilities.query("a").listen("click", function (e) {
            e.preventDefault();
            WinJS.Navigation.navigate(e.currentTarget.href);
        }, false); 

        viewModel = new HomeViewModel(element);
        viewModel.load(); //loads from indexed db

    },
    //etc...

待办事项页面：

 WinJS.UI.Pages.define("/pages/ToDo/ToDo.html", {
        ready: function (element, options) {    
            viewModel = new ToDoViewModel(element);

            viewModel.load();
        },
etc//

我知道没有什么可做的，但任何想法都会受到赞赏。

还有关于如何调试这样的东西的提示也会很棒。

更新

我从中心页面将其缩小到这一行：

myLib.GetData(todaysDate, function (result) {
  that.trendsModel.today = result;
  WinJS.Binding.processAll(that.el.querySelector("#dataPanel"), that.trendsModel); //<--Right Here
});

如果我删除它，那么当我加载第二页时，数据不会显示为未定义。有趣的是数据最初在第二页上正确显示，然后变为“未定义”。

解决方案

我的修复：

myLib.GetData(todaysDate, function (result) {
  var element = that.el.querySelector("#dataPanel");

  that.trendsModel.today = result;

  if(element) {
    WinJS.Binding.processAll(element, that.trendsModel); 
  }
});

当回调返回时，我已经在第二页了。所以没有找到选择器返回null。如果您将 null 传递给 processAll，它会尝试绑定整个页面，这就是为什么我能够在一秒钟内看到正确的数据，然后它会变为未定义......哇，真是太棒了。我想这是有道理的，但很难找到。

希望它在未来对某人有所帮助:)

4

2 回答 2

1

您的 ToDoViewModel 和 HomeViewModel 需要是observable。这意味着它们需要混合 from WinJS.Binding.mixin，并且对于您异步拉入的属性，它们需要this.notify("propertyName", newVal, oldVal)从属性设置器中调用。

请注意，您需要具有 getter/setter 属性。例如

var bindingBase = WinJS.Class.mix(function() {}, WinJS.Binding.mixin);
WinJS.Namespace.define("YourNamespace", {
    ToDoViewModel: WinJS.Class.derive(bindingBase, function constructor() {
    }, {
        _titleStorage: "",
        title: {
            get: function() { return this._titleStorage; },
            set: function(newValue) {
                if(newValue === this._titleStorage) {
                    return;
                }

                var old = this._titleStorage;
                this._titleStorage = newValue;
                this.notify("title", newValue, old);
             }
        }
    }),
});
于 2012-11-30T19:32:29.990 回答
0 
myLib.GetData(todaysDate, function (result) {
  var element = that.el.querySelector("#dataPanel");

  that.trendsModel.today = result;

  if(element) {
    WinJS.Binding.processAll(element, that.trendsModel); 
  }
});

当回调返回时，我已经在第二页了。所以没有找到选择器返回null。如果您将 null 传递给 processAll，它会尝试绑定整个页面，这就是为什么我能够在一秒钟内看到正确的数据，然后它会更改为未定义......哇，真是太棒了。我想这是有道理的，但很难找到。

于 2012-12-02T17:20:29.067 回答