我的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
作为输出,其颜色在点击时会发生变化。
但我不能将Many
和Any
作为输出!
需要帮助,谢谢!
答案 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}));