私のEmberコードは、ContainerView Controllerの下で子のビューをそのコントローラーにバインドしていません
MetricsView がコントローラーからタイトル属性値を取得していないテンプレート「メトリック」があります。これはコンテナ ビューの下の子ビューであり、コンテナ ビューの下にある他のすべてのビューでも同じことが起こります。
私が使用しているコードスニペントは次のとおりです。
これは私のコンテナビューがどのように見えるかです
// Container View
App.DashboardContainerView = Ember.ContainerView.create({
childViews: [],
view1: App.MetricsView,
view2: App.ResultsView,
});
これは私の子ビューがどのように見えるかです: App.MetricsView = Ember.View.create({ template: Ember.TEMPLATES["metrics"] });
これは、私の子ビューのコンテナーがどのように見えるかです: // 子ビューにバインドされていない子ビューのコントローラー、// このコントローラーからテンプレートにタイトルをレンダリングしたい
App.MetricsController = Ember.ObjectController.extend({
title: 'Metrics Page', // To Be deleted later
content : []
metrics : [],
view: Ember.View.create({
templateName: 'metrics'
}),
show : function(petId, onDone, onFail) {
_get('/fetch_one', onDone, onFail);
},
});
子テンプレート // ここで {{title}} は UI に出力されませんが、"-- Summary" が出力されます
<script type="text/x-handlebars" data-template-name="metrics">
<div class='well well-large'>
<div class="container">
<div class="row">
<div class="span9">
<h4>{{title}}</h4>
<h4> -- Summary</h4>
</div>
<div class="span1">
<button {{action "toggle" }} class="close">×</button>
</div>
</div>
</div>
</div>
</script>
その他のサポートされているコード:
var App = Ember.Application.create({
appName: 'Portal',
debug: true,
demomode: 1,
version: '0.0.1'
});
App.Router.map (function () {
this.resource('pets');
this.resource('pet', {path: ':pet_id'}, function(){
this.resource('dashboard');
this.resource('list', function() {
this.route('summary');
this.route('results');
});
});
});
//ApplicationRoute
App.ApplicationRoute = Ember.Route.extend({
setupController: function(){
},
});
App.IndexRoute = Ember.Route.extend({
redirect : function() {
this.transitionTo('pets');
}
});
App.PetsRoute = Ember.Route.extend({
model: function() {
return App.Pet.find();
},
renderTemplate: function () {
this.render({ outlet: 'rightpane' });
}
});
App.PetsController = Ember.ArrayController.extend({
sortProperties : [ 'first_name' ],
sortAscending : true
});
App.DashboardRoute = Ember.Route.extend({
setupController: function(){
var menuItems;
if (App.DashboardContainerView.get('childViews')) {
App.DashboardContainerView.get('childViews').pushObject(App.DashboardContainerView.view1);
App.DashboardContainerView.get('childViews').pushObject(App.DashboardContainerView.view2);
menuItems = this.controllerFor('petDashboardMenu').get('model');
$(menuItems).each(function(index, menuItem) {
if (menuItem.id == 1 || menuItem.id == 2) {
alert(menuItem);
}
}); //TODO: Make the menu buttons active for which view is added.
}
//this.controllerFor('pets').set('model', App.Preference.find({ name: "Dennis" }));
this.controllerFor('petDashboardMenu').set('model', App.PetMenuItem.find());
},
renderTemplate: function () {
this.render({ outlet: 'rightpane' });
}
});
App.DashboardController = Ember.ObjectController.extend({
name: 'Dashboard'
});
App.PetDashboardMenuController = Ember.ArrayController.extend({
toggleMenuItem: function(menuItem) {
var link = $(event.srcElement);
var childViews = App.DashboardContainerView.get('childViews');
if (link.hasClass('active')) {
link.removeClass('active');
var present = false;
switch (link.text()) {
case 'Summary':
present = App.DashboardContainerView.get('childViews').indexOf(App.DashboardContainerView.view1);
break;
case 'Results':
present = App.DashboardContainerView.get('childViews').indexOf(App.DashboardContainerView.view2);
break;
default:
present = App.DashboardContainerView.get('childViews').indexOf(App.DashboardContainerView.view1);
}
if(present >= 0) {
// ToDo : For All Menu Items
switch (link.text()) {
case 'Summary':
App.DashboardContainerView.get('childViews').removeObject(App.DashboardContainerView.view1);
break;
case 'Results':
App.DashboardContainerView.get('childViews').removeObject(App.DashboardContainerView.view2);
break;
default:
App.DashboardContainerView.get('childViews').removeObject(App.DashboardContainerView.view1);
}
App.log('Removed Summary : Removed : View Count : ' + App.DashboardContainerView.get('childViews').length);
} else {
App.log('Removed Summary : Already Not Present : View Count : ' + App.DashboardContainerView.get('childViews').length);
}
} else {
link.addClass('active');
var present = null;
App.log('Link Text : "' + link.text() + '"');
switch (link.text()) {
case 'Summary':
present = App.DashboardContainerView.get('childViews').indexOf(App.DashboardContainerView.view1);
break;
case 'Results':
present = App.DashboardContainerView.get('childViews').indexOf(App.DashboardContainerView.view2);
break;
default:
present = App.DashboardContainerView.get('childViews').indexOf(App.DashboardContainerView.view1);
}
if(present >= 0) {
App.log('Adding Summary : Already Present : View Count : ' + App.DashboardContainerView.get('childViews').length);
} else {
// ToDo : For All Menu Items
switch (link.text()) {
case 'Summary':
App.DashboardContainerView.get('childViews').pushObject(App.DashboardContainerView.view1);
break;
case 'Results':
App.DashboardContainerView.get('childViews').pushObject(App.DashboardContainerView.view2);
break;
default:
App.DashboardContainerView.get('childViews').pushObject(App.DashboardContainerView.view1);
}
App.log('Added Summary : View Count : ' + App.DashboardContainerView.get('childViews').length);
}
}
}
});
App.log = function(message) {
if(App.debug) {
console.log(message);
}
};
任意のポインタをいただければ幸いです?