Marionette:ProjectView不是由CompositeView呈现的

时间:2015-10-15 00:26:20

标签: javascript user-interface marionette

我的ItemView没有被我的CompositeView呈现:

我的app.js:

var express= require("express"),
    bodyparser= require("body-parser");

var app= express();

app.use(express.static(__dirname+ "/public"));
app.use(bodyparser.json());
app.use(bodyparser.urlencoded({extended: true}));

app.get("/*", function(req, res){
        res.render("index.jade");
});

app.listen(3002);

app.js正在调用index.jade:

doctype html

#nexter



script(id="tabler" type="text/template").
        <table>
            <thead>
                <tr id="check"> <td> One </td> </tr>
            </thead>

            <tbody id="tbody1">

            </tbody>
        </table>

script(id="urview", type="text/template")
        <tr> <td> <p> Many </p> </td> </tr>
        <tr> <td> <p> Any </p> </td> </tr>



script(src= "/jquery.js")
script(src= "/underscore.js")
script(src= "/backbone.js")
script(src= "/backbone.marionette.js")
script(src= "/theapp.js")

index.jade调用theapp.js:

var Usertracker= new Marionette.Application();

var Uview= Marionette.ItemView.extend({
        template: "#urview",
        el: "#tbody1"
});

var Usercompositeview= Marionette.CompositeView.extend({
        template: "#tabler",
        itemView: Uview,
        events: {
            "click #check": "eventer"
        },

        eventer: function(){
            $("p").css("background-color", "yellow");
            $("tr").css("background-color", "orange");
        }
});


Usertracker.addRegions({
        nexter: "#nexter"
});

Usertracker.addInitializer(function(){
        Usertracker.nexter.show(new Usercompositeview({}));
});

Usertracker.start();

我正在获取One作为输出,其颜色在点击时会发生变化。 但我不能将ManyAny作为输出!

需要帮助,谢谢!

1 个答案:

答案 0 :(得分:0)

所以,这里的问题是没有集合被传递到CompositeView
以下工作:
app.js

var express= require("express"),
    bodyparser= require("body-parser");

var app= express();

app.use(express.static(__dirname+ "/public"));
app.use(bodyparser.json());
app.use(bodyparser.urlencoded({extended: true}));

app.get("/*", function(req, res){
        res.render("index.jade");
});

app.listen(3002);

index.jade:

doctype html

#nexter

script(id="tabler" type="text/template").
            <table id="some" style="border: 1px solid black;">
                <thead>
                    <tr id="check"> <td> One </td> </tr>
                </thead>

                <tbody id="tbody1">

                </tbody>
            </table>

script(id="urview", type="text/template").
        <tr style="border: 1px solid black;"> 
            <td style="border: 1px solid black;"> <p> Many <%=idee%> </p> </td> 
            <td style="border: 1px solid black;"> <p> Any </p> </td> 
        </tr>

script(src= "/jquery.js")
script(src= "/underscore.js")
script(src= "/backbone.js")
script(src= "/backbone.marionette.js")
script(src= "/theapp.js")

theapp.js

var Usertracker= new Marionette.Application();

var M1= Backbone.Model.extend({});

var C1= Backbone.Collection.extend({
        model: M1
});

var c1= new C1([{idee: 21}, {idee: 43}, {idee: 54}]);

var Uview= Marionette.ItemView.extend({
        template: "#urview"
});

var Usercompositeview= Marionette.CompositeView.extend({
        template: "#tabler",
        childView: Uview,
                childViewContainer: "#tbody1",
        events: {
            "click #check": "eventer",
        },

        eventer: function(){
            $("p").css("background-color", "yellow");
            $("tr").css("background-color", "orange");
        }     
});

Usertracker.addRegions({
        nexter: "#nexter"
});

Usertracker.nexter.show(new Usercompositeview({collection: c1}));
相关问题