淘汰视图模型和requirejs答案

【问题标题】：knockout viewmodel and requirejs淘汰视图模型和requirejs
【发布时间】：2012-11-09 20:04:08
【问题描述】：

我最近开始使用 requirejs，当我尝试创建一个简单的视图模型时，我遇到了一个奇怪的异常。异常来自 knockout-2.1.0.js 文件，异常是“只有可订阅的事物才能充当依赖项”。

define("PageViewModel", ["knockout-2.1.0"], function(ko) {
    return function PageViewModel() {
        var self = this;
        self.visiblePage = ko.observable("StartPage");
        self.showPage = function (pageName) {
            self.visiblePage(pageName);
        };
    };
});

正如您所见，viewmodel 非常简单，并且由于错误出现在敲除 js 文件中，因此似乎 requirejs 正在正常工作。我一直在看：http://knockoutjs.com/documentation/amd-loading.html 来行时出现异常：self.visiblePage = ko.observable("StartPage");

关于我做错了什么有什么想法吗？

谢谢，路德维希

更新：这是包含 pageviewmodel 的模块：

define("ViewModelFactory", ["StorageService", "PageViewModel", "AddUnitViewModel", "AddRoomViewModel"],
function (StorageService, PageViewModel, AddUnitViewModel, AddRoomViewModel) {
    //var repositoryStorage = new StorageService();
    var createAddRoomVM = function () {
        var vm = new AddRoomViewModel();
        vm.setRepository = StorageService.getRoomRepository();
        return vm;
    };
    var createAddUnitVM = function () {
        var vm = new AddUnitViewModel();
        vm.setRepository = StorageService.getUnitRepository();
        return vm;
    };
    var createPageVM = function () {
        var vm = new PageViewModel();
        return vm;
    };

    return {
        createPageVM:createPageVM,
        createAddRoomVM: createAddRoomVM,
        createAddUnitVM: createAddUnitVM
    };
});

以及调用工厂的模块

define("ApplicationViewModel", ["ViewModelFactory"],
function (viewModelFactory) {
    mainVM = null;
    var initVM = function () {
        mainVM = {
            page: viewModelFactory.createPageVM(),
            addRoom: viewModelFactory.createAddRoomVM(),
            addUnit: viewModelFactory.createAddUnitVM()
        };
    };

    var getVM = function (viewName) {
        switch (viewName) {
            case "AddRoom":
                return mainVM.addRoom;
            case "AddUnit":
                return mainVM.addUnit;
            default:
                return null;
        }
    };
    var getPageVM = function () {
        return mainVM.page;
    };

    return {
        initVM: initVM,
        getVM: getVM,
        getPageVM: getPageVM,
        mainVM: mainVM
    };
});

以及包含 applicationViewModel 的类：

define("Bootstrapper", ["knockout-2.1.0", "Routing", "ApplicationViewModel"],
function (ko, routing, applicationViewModel) {
    var run = function () {
        applicationViewModel.initVM(); <-- after here mainVM.page is null
        var mainVM = applicationViewModel.mainVM;
        routing.initRouting(applicationViewModel);
        ko.applyBindings(mainVM);
        routing.showView("StartPage");
        alert("Start");
    };

    return {
        run: run
    };
})

【问题讨论】：

你能把你的代码贴在你使用PageViewModel的地方吗？也许还有你的视图代码？
根据ko source code，在第956行，当属性不可订阅时会发生该异常。
该属性应该是可订阅的，因为我想它只是一个常规变量......
您使用的是缩小版还是调试版的淘汰赛？
我把knout更新到2.2.0然后改debug突然就开始工作了！

标签： mvvm knockout.js viewmodel requirejs

【解决方案1】：

您的问题可能是由 Knockout 2.1 引起的，当 ko 不是全局变量时，它无法正常工作。

淘汰赛 2.2 应该可以正常工作，我从您的评论中看到这确实解决了问题。

【讨论】：