Question

我有一个使用DurandalJS和KnockoutJS的SPA。在我的初始页面上，我允许单击某个项目，然后加载该项目的辅助页面。这是我访问辅助页面的方式：

var goToDetails = function (selectedDailyLog) {

        var url = '#/dailylog/' + selectedDailyLog.id();

        //durandal/plugins/router is sammy.js

        router.navigateTo(url);

    };

在辅助页面上，我试图调用ko.applyBindings并且我不断收到以下错误：

未捕获错误：无法解析绑定。消息：ReferenceError：未定义路由器; 绑定值：foreach：router.visibleRoutes

以下是辅助页面的javascript：

define(['config', 'durandal/system', 'services/logger', 'services/dataservice'],
function (config, system, logger, dataservice) {

    var owners = ko.observableArray();
    var selectedOwner = ko.observable();
    var dailyLog = ko.observable({ started: 'one' });
    var routeCriteria;

    //#region Internal Methods
    function activate(routeData) {      

        routeCriteria = routeData;
        dataservice.getOwners(owners);

        logger.log('Daily Log Activated with Id: ' + routeData.id.toString(), null, 'dailylog', true);

        return true;
    }

    var vm = {
        activate: activate,
        title: 'Daily Log',
        owners: owners,
        selectedOwner: selectedOwner,
        dailyLog:dailyLog
    };
    ko.applyBindings(vm);
    return vm;

}）;

提前感谢您的帮助。

Answer 1

上面的例子中有一些事情会跳出来。首先在Durandal应用程序中，没有理由自己调用ko.applyBindings(vm)，因为Durandal的composition system涵盖了这一点。其次，activate函数返回true，如果dataservice.getOwners(owners)是同步操作，则允许这样做，否则你必须确保返回一个promise。

让我们来看看当ko.applybinding（vm）运行并产生错误消息时会发生什么。在没有第二个参数的情况下运行ko.applyBinding时，它会尝试将vm绑定到整个DOM。这在第一次出现的未在vm中定义的属性时发生冲突。例如默认的初始模板在shell.html或nav.html中有导航部分，例如https://github.com/dFiddle/dFiddle-1.2/blob/gh-pages/App/samples/shell.html#L4

<div>
    <div class="navbar navbar-fixed-top">
        <div class="navbar-inner">
            <a class="brand" data-bind="attr: { href: router.visibleRoutes()[0].hash }">
                <i class="icon-home"></i>
                <span>Durandal</span>
            </a>

在示例中，返回的vm没有定义路由器，因此系统产生错误。

var vm = {
    activate: activate,
    title: 'Daily Log',
    owners: owners,
    selectedOwner: selectedOwner,
    dailyLog:dailyLog
};
// ko.applyBindings(vm); // Do NOT call applyBinding in a Durandal app
return vm;

但如上所述，你只是看到了呼叫的症状，而这些呼叫本来就不应该发生。您可能需要查看https://github.com/RainerAtSpirit/Durandal-Fiddle或https://github.com/johnpapa/PluralsightSpaJumpStartFinal等示例，以了解有关Durandal建筑原则的更多信息。

Answer 2

我可能意味着该视图正在寻找将某些导航链接绑定到的路由数据。在您发布的代码中，您不会返回路由对象。

我不确定您的应用程序是如何设置的，但这可能有所帮助：

define(
[
    'config', 
    'durandal/system', 
    'services/logger', 
    'services/dataservice', 
    'durandal/plugins/router'
],
function (config, system, logger, dataservice, router) {

... your code here ...

var vm = {
    activate: activate,
    title: 'Daily Log',
    owners: owners,
    selectedOwner: selectedOwner,
    dailyLog:dailyLog,
    router: router
};
ko.applyBindings(vm);
return vm;

Knockout applyBindings错误

2 个答案: