1

我很难从使用 RequireJS 和 Knockout 的模块返回数据来填充我的单页应用程序的标记。Knockout 似乎找不到我的数据绑定 observables。

我试图将每个视图保存在一个单独的 js 文件中,但我无法确定我哪里出错了。这是我到目前为止所拥有的:

/app/app.js

define(function(require) {

require('simrou');

var $ = require('jQuery'),
    ko = require('knockout'),
    videoView = require('videoView');

    var init = function() {

        var viewModel = function() {
            var self = this;
            self.currentPage = ko.observable();
            self.videoView = new videoView();
        }

        var view = new viewModel();

        ko.applyBindings( view );

        _router = new Simrou({
            '/video/:id': [ view.videoView.getVideo ]
        });

        _router.start();

    };

    return {
       init: init
    };

});

/app/videoView.js

define(function(require) {

"use strict";

var $ = require('jQuery'),
    ko = require('knockout');

    return function() { 
        var self = this;
        self.currentPage = ko.observable( 'showVideo' );
        self.currentVideo = ko.observable();
        self.videoData = ko.observableArray([]);
        self.videoList = ko.observableArray([]);

        var getVideo = function( event, params ) {
            // ajax pseudo code
            $.ajax({});

            self.videoData( dataFromAjaxCall );
        }

        return {
            getVideo: getVideo
        };

    };

});

索引.html

当我浏览到 /#/video/14 时,我收到以下错误:

    Uncaught ReferenceError: Unable to parse bindings.
    Bindings value: attr: { 'data-video-id': videoData().id }
    Message: videoData is not defined

这是标记:

<section id="showVideo" data-bind="fadeVisible: currentPage()=='showVideo', with: $root">

    <div class="video" data-bind="attr: { 'data-video-id': videoData().id }></div>
</section>

就像我说的那样,我试图将每个视图分开,但我希望对我做错的事情有所启发,或者这是否可能?有没有更好更有效的方法?

4

1 回答 1

0

videoData是 的属性$root.videoView,而不是根模型(您传递给 的模型)的属性applyBindings。它也是一个observableArray, 所以videoData()只是一个普通数组,即使你得到正确的上下文,你也无法访问它的id属性,因为作为一个数组,它没有 .named 属性。

于 2013-10-17T02:38:23.373 回答