Моделът не се изобразява в Backbone.js

Създавам просто мобилно javascript приложение с Backbone.js и Forge. Това, което се опитвам да направя, е да имам модел на предложение и колекция от категории от тези модели и да създам едно предложение и да го изобразя в изгледа с помощта на шаблон за подчертаване. Но това предложение не се изобразява. Ето файла main.js:

(function ($) {
    forge.enableDebug();

    var Suggestion = Backbone.Model.extend({

        urlRoot: function () {
            if (this.isNew()){
                return "/suggestions"
            }
            "/suggestions/" + this.id + ".json"
        },
        defaults: {
            id: this.Category.length + 1,
            title: "A Suggestion",
            description: "You should go suggest something",
            ranking: 1,
            done: false,
        },
        initialize: function() {
            forge.logging.log('The suggestion model has been initialized')
        },

    });


    var Category = Backbone.Collection.extend({
        model: Suggestion,

        urlRoot: function(){
            '/suggestions'
        },

        random: function(){
            var randomnumber=Math.floor(Math.random()*this.length + 0)
            forge.logging.log("just randomized" + randomnumber )
        },
        initialize: function(){
            forge.logging.log("app initiliazed")
            //this.fetch();
        },

        addSuggestions: function(suggestions){

        },

    }});


    Router = Backbone.Router.Extend({
        routes:{
            "":"index",
            "suggestion/:suggestion_id":"Suggestion"
        },

        index: function(){
            category.index();
        }
    });
    SuggestionView = Backbone.View.Extend({

        model: Suggestion
        el: $('#suggestions')
        tagName: "div",

        className: "suggestion"

        template: _.template($("#SuggestionTemplate").html())

        render: function(){
            $(this.el).html(template(this.model.toJSON()));
        },

        events:{
            "tap li": "DetailedView"
        },

        initialize: function(){
            forge.logging.log("rendering suggestions")
            this.render();
        }




    });
    DetailedView = Backbone.View.Extend({

        model: Suggestion
        template: _.template($("#DetailedTemplate").html)

        render: function(){
            this.$el.html(template(this.model.toJSON))
        }
    });
    CategoryView = Backbone.View.Extend({
        el:$("#main")
        tagname: "div",

        initialize: function(){
            forge.logging.log("rendering Suggestions")
            this.render();

        },

        render: function(){
            this.Suggestions.each(this.addOne)
        }
        addOne: function(suggestion){
            var view = new SuggestionView
            this.$el.append(view.render().el)
        }


    });

    var suggestion1 = new Suggestion()
    suggestion1.set(title:"this")

    var category = new Category();
    var router = new Router();
    var categoryView = new CategoryView();


} (jQuery));

И index.html:

<!DOCTYPE html>
<html>
    <head>
    <title>Just The Best</title>
    <link rel="stylesheet" href="/bgcss/jquery.mobile-1.1.0.min.css" />
    <script type="text/javascript" src="js/underscore.js"></script>
    <script type="text/javascript" src="js/backbone.js"></script>
    <script data-main="scripts/main" src="js/require.js"></script>
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>

    <script type="text/javascript" src="js/main.js"></script>

    <script src="https://trigger.io/catalyst/target/target-script-min.js#47DC7BF1-5D55-4549-8B64-216CA27A73FF"></script>

    <link rel="stylesheet" href="/bgcss/style.css" />

</head>
<body>

<div data-role="page">
    <div id="#main">

    </div>


</div>
<script type="text/html" id="SuggestionTemplate">
    //<div class="suggestion">
        <h2>Suggestion</h2>
        <h3><%=Suggestion.title%></h3>

    //</div>
</script>

</body>

Наистина съжалявам, ако пропускам основна функция. Благодаря ти.


javascript forge backbone.js trigger.io
person MichaelFine    schedule 12.08.2012    source източник
comment
Откъде идва this.Suggestions в CategoryView?   -  person mu is too short    schedule 12.08.2012
comment
CategoryView's колекция е Category, която има модел Suggestion. Мислех, че можете да извикате модела като функция, но може би не.   -  person MichaelFine    schedule 12.08.2012

Отговори (1)


arrow_upward
1
arrow_downward

По-често се предава el към конструкторите на изглед, отколкото към extend(). Що се отнася до останалата част от него, вероятно искате нещо повече като следното. Освен това в кода ви липсват много точки и запетаи.

CategoryView = Backbone.View.Extend( {

    // ...

    render : function () {

        this.collection.each( _.bind( this.addOne, this ) );

    },

    addOne : function( suggestion ) {

        var view = new SuggestionView( { model : suggestion } );

        this.$el.append( view.render().el );

    }

} );


var category = new Category( [

  { title : "this" }

] );

var router = new Router();

var categoryView = new CategoryView( {

  collection : category

} );
person JMM    schedule 12.08.2012