2013-05-07 92 views
1

我有一个应用程序,我正在使用Durandal和Knockout构建,并且在我的SPA中使用durandal导航到其中一个页面时似乎存在问题。当我从主屏幕加载应用程序并导航到具有一系列级联下拉菜单的第二页时,它看起来好像绑定断开。如果我刷新页面并加载第二页开始使用绑定,则所有这一切似乎都按预期工作。第一页除了标题外没有任何内容,第二页有级联下拉菜单。老实说,我不确定在这个问题上包含什么代码,所以如果有人想看看,请随时提问。我使用“Knockout Context”Chrome浏览器插件查看Knockout上下文,除了结果未显示外,一切似乎都正常。Durandal干扰敲除绑定?

即是具有simplier视图模型问题

define(['services/logger', 
    "services/datacontext"], 
function (logger, datacontext) { 
    var manufacturers = ko.observableArray(); 
    var manufacturer = ko.observable(); 
    var isSaving = ko.observable(false); 
    var modelsWithSizes = ko.observableArray(); 

    manufacturer.subscribe(function (newValue) { 
     datacontext.getBikeModelsWithSizes(modelsWithSizes, newValue.manufacturerID()); 
    }); 


    var hasChanges = ko.computed(function() { 
     return datacontext.hasChanges(); 
    }); 

    var cancel = function() { 
     datacontext.cancelChanges(); 
    }; 

    var canSave = ko.computed(function() { 
     return hasChanges() && !isSaving(); 
    }); 

    var save = function() { 
     isSaving(true); 
     return datacontext.saveChanges().fin(complete); 

     function complete() { 
      isSaving(false); 
     } 
    }; 

    var canDeactivate = function() { 
     if (hasChanges()) { 
      var title = 'Do you want to leave ?'; 
      var msg = 'Navigate away and cancel your changes?'; 
      var checkAnswer = function (selectedOption) { 
       if (selectedOption === 'Yes') { 
        cancel(); 
       } 
       return selectedOption; 
      }; 
      return app.showMessage(title, msg, ['Yes', 'No']) 
       .then(checkAnswer); 

     } 
     return true; 
    }; 

    var vm = { 
     activate: activate, 
     cancel: cancel, 
     canDeactivate: canDeactivate, 
     canSave: canSave, 
     hasChanges: hasChanges, 
     manu: manufacturer, 
     manufacturers: manufacturers, 
     modelsWithSizes: modelsWithSizes, 
     save: save 
    }; 

    return vm; 

    //#region Internal Methods 
    function activate() { 
     manufacturers(datacontext.lookups.manufacturers), 
     logger.log('Frames View Activated', null, 'frames', false); 
     return true; 
    } 


    //#endregion 
}); 

DataContext的通话如下

datacontext.lookups = { 
    manufacturers: function() 
    { return getLocal('Manufacturers', 'name', true); } 
}; 
+0

你需要包括像“页”的ViewModels模块的一些代码,什么叫你激活功能 – 7zark7 2013-05-07 01:12:03

+0

我已经添加了更简单的有问题的ViewModels的。当你提到调用activate函数的东西时,你是否正在用router.map调用谈论shell.js? – PlTaylor 2013-05-07 01:20:08

+0

我很好奇,如果“datacontext.lookups.manufacturers”是一个Ajax或异步调用?如果是这样的话,那就是绊倒了我,因为你预计会从激活的呼叫中返回一个承诺。 – 7zark7 2013-05-07 05:30:02

回答

0

如果datacontext.lookups.manufacturers是预装的observableArray,你可能需要改变你的激活函数为:

function activate() { 
    vm.manufacturers(datacontext.lookups.manufacturers()); 
    logger.log('Frames View Activated', null, 'frames', false); 
    return true; 
}; 

如果datacontext.lookups.manu facturers是一个异步调用Web API,你会想将其改为:我不使用的微风,所以我不知道,如果是getLocal()异步或不

function activate() { 
    logger.log('Frames View Activated', null, 'frames', false); 
    return datacontext.lookups.manufacturers().then(querySuccess); 

    function querySuccess(data) 
    { 
     vm.manufacturers(data.results); 
    }; 
}; 
+0

这是一个预加载的数组,我把它变成了一个函数,并将它包含在原始问题中。 – PlTaylor 2013-05-07 11:09:45

+0

当我的viewmodel文件中缺少分号时,我遇到了一些问题。尽量确保所有函数都有一个结尾分号。 – 2013-05-22 05:51:53

0

,但如果有疑问返回包裹$.when(syncOrAsync).then(...)

function activate() { 
    var manufacturesPromise = datacontext.lookups.manufacturers(); 
    logger.log('Frames View Activated', null, 'frames', false); 

    return $.when(manufacturesPromise).then(function(results){ 
     manufacturers(results); 
    }); 
} 
+0

这使得很多感觉。但是当我执行它时,我的绑定仍然被破坏,我不知道为什么。 – PlTaylor 2013-05-08 11:54:33

+0

您可以使用OOTB Durandal模拟datacontext请求并创建测试用例吗?这个repo(https://github.com/dFiddle/dFiddle-1.2)正在进行中,缺乏深入的文档,但它可能是产生可在此讨论的测试案例的最快方法。 – RainerAtSpirit 2013-05-08 17:45:46

+0

OOTB?如果你认为这会有所帮助,我可以开始尝试重现这个问题。 – PlTaylor 2013-05-08 18:14:34