Backbone JS没有处理我的模型

时间:2013-05-12 02:30:12

标签: backbone.js

我无法让我的backbone.js应用程序接受我的模型。有人知道发生了什么事吗?

该网站为http://www.sheetmusicondemand.net/backbone2.html

代码就在这里:

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.1/css/bootstrap.min.css" />
        <title></title>
    </head>
    <body>
        <div class="container">
            <h1>Backbone Demo</h1>
            <hr />
            <div class="page">
            </div>
        </div>

        <script type="text/template" id="song-list-template">
            <h3>Songs</h3>
            <% _.each(songs, function(song) { console.log song.toJSON();%>

            <h4>Title: <%= song.title %></h4>
            <% } %>
        </script>

        <!--    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone-min.js"></script>-->
        <script src="/Scripts/jquery-1.8.2.min.js"></script>
        <script src="/Scripts/underscore.js"></script>
        <script src="/Scripts/backbone.js"></script>
        <script>
            $.ajaxPrefilter(function (options, originalOptions, jqXHR) {
                options.url = 'http://www.onlinesheetmusic.com/api2/' + options.url;
            });

            function htmlEncode(value) {
                return $('<div/>').text(value).html();
            }

            function htmlDecode(value) {
                return $('<div/>').html(value).text();
            }

            $.fn.serializeObject = function () {
                var o = {};
                var a = this.serializeArray();
                $.each(a, function () {
                    if (o[this.name] !== undefined) {
                        if (!o[this.name].push) {
                            o[this.name] = [o[this.name]];
                        }
                        o[this.name].push(this.value || '');
                    } else {
                        o[this.name] = this.value || '';
                    }
                });
                return o;
            };

            var Songs = Backbone.Collection.extend({
                url: '/product'
            });

            var Song = Backbone.Model.extend({
                urlRoot: '/product'
            });

            var SongList = Backbone.View.extend({
                el: '.page',
                render: function () {
                    var that = this;
                    var songs = new Songs();
                    songs.fetch({
                        success: function (songs) {
                            console.log($(songs).serializeObject());
                            var template = _.template($('#song-list-template').html(), { songs: songs.models });
                            that.$el.html(template);
                        }
                    });
                }
            });

            var Router = Backbone.Router.extend({
                routes: {
                    '': 'home'
                }
            });

            var songList = new SongList();

            var router = new Router();
            router.on('route:home', function () {
                songList.render();
            });

            Backbone.history.start();
        </script>
    </body>
    </html>

它一直返回Uncaught Syntax Error并且该对象为空。我所要做的就是让它处理返回的数据。为什么不打印歌曲标题?我缺少什么?

1 个答案:

答案 0 :(得分:1)

我想:

<% _.each(songs, function(song) { console.log song.toJSON();%>

应该是:

<% _.each(songs, function(song) { console.log(song.toJSON());%>