Ember.js 为什么即使请求返回了正确的相关模型,相关模型也没有加载到模板中?
基本上我有一个徽章模板,它有一个对应的徽章模型。每个徽章都有一位导师。但是,当我加载模板时,会调用徽章模型并显示其数据。如果我检查网络请求,则应用程序正在请求正确的导师,但它没有显示在模板上。你知道为什么会这样吗 徽章Ember.js 为什么即使请求返回了正确的相关模型,相关模型也没有加载到模板中?,ember.js,ember-data,Ember.js,Ember Data,基本上我有一个徽章模板,它有一个对应的徽章模型。每个徽章都有一位导师。但是,当我加载模板时,会调用徽章模型并显示其数据。如果我检查网络请求,则应用程序正在请求正确的导师,但它没有显示在模板上。你知道为什么会这样吗 徽章 App.Badge = DS.Model.extend({ 'category': DS.belongsTo('category'), 'title': attr('string'), 'type': attr('string'), 'ord':
App.Badge = DS.Model.extend({
'category': DS.belongsTo('category'),
'title': attr('string'),
'type': attr('string'),
'ord': attr('number'),
'short_description': attr('string'),
'full_description': attr('string'),
'mentor': DS.belongsTo('employee' , { async: true } ),
'parent':DS.belongsTo('badge'),
'icon': attr('string'),
'required': attr('boolean'),
'signoff_role': attr('string'),
'created_at': attr('string'),
'updated_at': attr('string'),
'resources': DS.hasMany('resource', { async: true } ),
'quiz': DS.belongsTo('quiz', { async: true } )
});
App.Employee = DS.Model.extend({
'badge': DS.belongsTo('badge', { async:true } ),
'employee_preferred_name': DS.attr('string'),
'email': DS.attr('string'),
'phone': DS.attr('string')
});
App.BadgeRoute = Ember.Route.extend({
model: function(params) {
return this.store.find('badge',params.badge_id);
},
renderTemplate: function() {
this.render('categories',{outlet: "categoriesList"});
this.render('category',{outlet: "badgeList"});
this.render('badge',{outlet: "body"});
this.render('badge/index',{outlet:'badgeBody',into: "badge"})
}
});
<div class="row">
<div class="col col-lg-12">
{{! Section }}
<h3>Basic Info</h3>
<hr>
{{! Tag Line }}
<div class="row" style="margin-bottom:30px">
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Tag Line</h4>
</div>
{{#view App.EditTagLineView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<div class="container" style="margin-top:1em;">
{{#if short_description}}
{{short_description}}
{{else}}
<span class="text-muted">No Tag Line provided</span>
{{/if}}
<div>
</div>
{{! Description }}
<div class="row">
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Description</h4>
</div>
{{#view App.EditDescriptionView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<div class="container" style="margin-top:1em;">
{{#if full_description}}
{{markdown full_description}}
{{else}}
<span class="text-muted">No description provided</span>
{{/if}}
<div>
</div>
{{! Mentor }}
<div class="row">
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Mentor</h4>
</div>
{{#view App.EditDescriptionView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<div class="container" style="margin-top:1em;">
{{#if mentor}}
Name:{{mentor.employee_preferred_name}}<br>
Email: {{mentor.email}}<br>
Phone: {{mentor.phone}}
{{else}}
wow
{{/if}}
<div>
</div>
</div>
</div>
{{!--
<div class="row">
<div class="col col-lg-12">
<h3>Basic Info</h3>
<hr>
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Tag Line</h4>
</div>
{{#view App.EditTagLineView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<p>
{{#if isEditingTagLine}}
{{view Ember.TextField valueBinding="short_description" class="form-control" style="padding-top:10px"}}
<hr>
<button {{action saveTagLine}} class="btn btn-success">Save</button>
{{else}}
{{#if short_description}}
{{short_description}}
{{else}}
No tag line provided
{{/if}}
{{/if}}
</p>
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>
Description
</h4>
</div>
{{#view App.EditDescriptionView}}
<h4 {{bindAttr class=":glyphicon isEditingDescription:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<p>
{{#if isEditingDescription}}
{{view Ember.TextArea valueBinding="full_description" class="form-control" rows="6"}}
<hr>
<button {{action saveDescription}} class="btn btn-success">Save</button>
<a href="http://daringfireball.net/projects/markdown/syntax" target="new" class="btn btn-link"><span class="glyphicon glyphicon-info-sign"></span> More on Markdown </a>
{{else}}
{{#if full_description}}
{{markdown full_description}}
{{else}}
<span class="text-muted">no description provided</span>
{{/if}}
{{/if}}
</p>
</div>
</div>
<div class="row page-header-title" >
<div class="col col-lg-11">
<h4>
Mentor
</h4>
</div>
<div class="col col-lg-1">
<h4 class="glyphicon glyphicon-pencil edit-button"></h4>
</div>
</div>
{{#if mentor}}
<address>
{{log mentor}}
<strong> {{mentor.employee_preferred_name}}</strong>
<br>
{{#if mentor.phone}}
<abbr title="Phone">P:</abbr> {{mentor.phone}} <br>
{{else}}
<small> no phone number provided </small> <br>
{{/if}}
{{#if mentor.email}}
<abbr title="Email">E:</abbr> {{mentor.email}}
{{else}}
<small> no email number provided </small> <br>
{{/if}}
</address>
{{/if}}
</div>
</div>
--}}
员工
App.Badge = DS.Model.extend({
'category': DS.belongsTo('category'),
'title': attr('string'),
'type': attr('string'),
'ord': attr('number'),
'short_description': attr('string'),
'full_description': attr('string'),
'mentor': DS.belongsTo('employee' , { async: true } ),
'parent':DS.belongsTo('badge'),
'icon': attr('string'),
'required': attr('boolean'),
'signoff_role': attr('string'),
'created_at': attr('string'),
'updated_at': attr('string'),
'resources': DS.hasMany('resource', { async: true } ),
'quiz': DS.belongsTo('quiz', { async: true } )
});
App.Employee = DS.Model.extend({
'badge': DS.belongsTo('badge', { async:true } ),
'employee_preferred_name': DS.attr('string'),
'email': DS.attr('string'),
'phone': DS.attr('string')
});
App.BadgeRoute = Ember.Route.extend({
model: function(params) {
return this.store.find('badge',params.badge_id);
},
renderTemplate: function() {
this.render('categories',{outlet: "categoriesList"});
this.render('category',{outlet: "badgeList"});
this.render('badge',{outlet: "body"});
this.render('badge/index',{outlet:'badgeBody',into: "badge"})
}
});
<div class="row">
<div class="col col-lg-12">
{{! Section }}
<h3>Basic Info</h3>
<hr>
{{! Tag Line }}
<div class="row" style="margin-bottom:30px">
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Tag Line</h4>
</div>
{{#view App.EditTagLineView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<div class="container" style="margin-top:1em;">
{{#if short_description}}
{{short_description}}
{{else}}
<span class="text-muted">No Tag Line provided</span>
{{/if}}
<div>
</div>
{{! Description }}
<div class="row">
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Description</h4>
</div>
{{#view App.EditDescriptionView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<div class="container" style="margin-top:1em;">
{{#if full_description}}
{{markdown full_description}}
{{else}}
<span class="text-muted">No description provided</span>
{{/if}}
<div>
</div>
{{! Mentor }}
<div class="row">
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Mentor</h4>
</div>
{{#view App.EditDescriptionView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<div class="container" style="margin-top:1em;">
{{#if mentor}}
Name:{{mentor.employee_preferred_name}}<br>
Email: {{mentor.email}}<br>
Phone: {{mentor.phone}}
{{else}}
wow
{{/if}}
<div>
</div>
</div>
</div>
{{!--
<div class="row">
<div class="col col-lg-12">
<h3>Basic Info</h3>
<hr>
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Tag Line</h4>
</div>
{{#view App.EditTagLineView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<p>
{{#if isEditingTagLine}}
{{view Ember.TextField valueBinding="short_description" class="form-control" style="padding-top:10px"}}
<hr>
<button {{action saveTagLine}} class="btn btn-success">Save</button>
{{else}}
{{#if short_description}}
{{short_description}}
{{else}}
No tag line provided
{{/if}}
{{/if}}
</p>
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>
Description
</h4>
</div>
{{#view App.EditDescriptionView}}
<h4 {{bindAttr class=":glyphicon isEditingDescription:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<p>
{{#if isEditingDescription}}
{{view Ember.TextArea valueBinding="full_description" class="form-control" rows="6"}}
<hr>
<button {{action saveDescription}} class="btn btn-success">Save</button>
<a href="http://daringfireball.net/projects/markdown/syntax" target="new" class="btn btn-link"><span class="glyphicon glyphicon-info-sign"></span> More on Markdown </a>
{{else}}
{{#if full_description}}
{{markdown full_description}}
{{else}}
<span class="text-muted">no description provided</span>
{{/if}}
{{/if}}
</p>
</div>
</div>
<div class="row page-header-title" >
<div class="col col-lg-11">
<h4>
Mentor
</h4>
</div>
<div class="col col-lg-1">
<h4 class="glyphicon glyphicon-pencil edit-button"></h4>
</div>
</div>
{{#if mentor}}
<address>
{{log mentor}}
<strong> {{mentor.employee_preferred_name}}</strong>
<br>
{{#if mentor.phone}}
<abbr title="Phone">P:</abbr> {{mentor.phone}} <br>
{{else}}
<small> no phone number provided </small> <br>
{{/if}}
{{#if mentor.email}}
<abbr title="Email">E:</abbr> {{mentor.email}}
{{else}}
<small> no email number provided </small> <br>
{{/if}}
</address>
{{/if}}
</div>
</div>
--}}
徽章路线
App.Badge = DS.Model.extend({
'category': DS.belongsTo('category'),
'title': attr('string'),
'type': attr('string'),
'ord': attr('number'),
'short_description': attr('string'),
'full_description': attr('string'),
'mentor': DS.belongsTo('employee' , { async: true } ),
'parent':DS.belongsTo('badge'),
'icon': attr('string'),
'required': attr('boolean'),
'signoff_role': attr('string'),
'created_at': attr('string'),
'updated_at': attr('string'),
'resources': DS.hasMany('resource', { async: true } ),
'quiz': DS.belongsTo('quiz', { async: true } )
});
App.Employee = DS.Model.extend({
'badge': DS.belongsTo('badge', { async:true } ),
'employee_preferred_name': DS.attr('string'),
'email': DS.attr('string'),
'phone': DS.attr('string')
});
App.BadgeRoute = Ember.Route.extend({
model: function(params) {
return this.store.find('badge',params.badge_id);
},
renderTemplate: function() {
this.render('categories',{outlet: "categoriesList"});
this.render('category',{outlet: "badgeList"});
this.render('badge',{outlet: "body"});
this.render('badge/index',{outlet:'badgeBody',into: "badge"})
}
});
<div class="row">
<div class="col col-lg-12">
{{! Section }}
<h3>Basic Info</h3>
<hr>
{{! Tag Line }}
<div class="row" style="margin-bottom:30px">
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Tag Line</h4>
</div>
{{#view App.EditTagLineView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<div class="container" style="margin-top:1em;">
{{#if short_description}}
{{short_description}}
{{else}}
<span class="text-muted">No Tag Line provided</span>
{{/if}}
<div>
</div>
{{! Description }}
<div class="row">
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Description</h4>
</div>
{{#view App.EditDescriptionView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<div class="container" style="margin-top:1em;">
{{#if full_description}}
{{markdown full_description}}
{{else}}
<span class="text-muted">No description provided</span>
{{/if}}
<div>
</div>
{{! Mentor }}
<div class="row">
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Mentor</h4>
</div>
{{#view App.EditDescriptionView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<div class="container" style="margin-top:1em;">
{{#if mentor}}
Name:{{mentor.employee_preferred_name}}<br>
Email: {{mentor.email}}<br>
Phone: {{mentor.phone}}
{{else}}
wow
{{/if}}
<div>
</div>
</div>
</div>
{{!--
<div class="row">
<div class="col col-lg-12">
<h3>Basic Info</h3>
<hr>
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Tag Line</h4>
</div>
{{#view App.EditTagLineView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<p>
{{#if isEditingTagLine}}
{{view Ember.TextField valueBinding="short_description" class="form-control" style="padding-top:10px"}}
<hr>
<button {{action saveTagLine}} class="btn btn-success">Save</button>
{{else}}
{{#if short_description}}
{{short_description}}
{{else}}
No tag line provided
{{/if}}
{{/if}}
</p>
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>
Description
</h4>
</div>
{{#view App.EditDescriptionView}}
<h4 {{bindAttr class=":glyphicon isEditingDescription:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<p>
{{#if isEditingDescription}}
{{view Ember.TextArea valueBinding="full_description" class="form-control" rows="6"}}
<hr>
<button {{action saveDescription}} class="btn btn-success">Save</button>
<a href="http://daringfireball.net/projects/markdown/syntax" target="new" class="btn btn-link"><span class="glyphicon glyphicon-info-sign"></span> More on Markdown </a>
{{else}}
{{#if full_description}}
{{markdown full_description}}
{{else}}
<span class="text-muted">no description provided</span>
{{/if}}
{{/if}}
</p>
</div>
</div>
<div class="row page-header-title" >
<div class="col col-lg-11">
<h4>
Mentor
</h4>
</div>
<div class="col col-lg-1">
<h4 class="glyphicon glyphicon-pencil edit-button"></h4>
</div>
</div>
{{#if mentor}}
<address>
{{log mentor}}
<strong> {{mentor.employee_preferred_name}}</strong>
<br>
{{#if mentor.phone}}
<abbr title="Phone">P:</abbr> {{mentor.phone}} <br>
{{else}}
<small> no phone number provided </small> <br>
{{/if}}
{{#if mentor.email}}
<abbr title="Email">E:</abbr> {{mentor.email}}
{{else}}
<small> no email number provided </small> <br>
{{/if}}
</address>
{{/if}}
</div>
</div>
--}}
徽章模板
App.Badge = DS.Model.extend({
'category': DS.belongsTo('category'),
'title': attr('string'),
'type': attr('string'),
'ord': attr('number'),
'short_description': attr('string'),
'full_description': attr('string'),
'mentor': DS.belongsTo('employee' , { async: true } ),
'parent':DS.belongsTo('badge'),
'icon': attr('string'),
'required': attr('boolean'),
'signoff_role': attr('string'),
'created_at': attr('string'),
'updated_at': attr('string'),
'resources': DS.hasMany('resource', { async: true } ),
'quiz': DS.belongsTo('quiz', { async: true } )
});
App.Employee = DS.Model.extend({
'badge': DS.belongsTo('badge', { async:true } ),
'employee_preferred_name': DS.attr('string'),
'email': DS.attr('string'),
'phone': DS.attr('string')
});
App.BadgeRoute = Ember.Route.extend({
model: function(params) {
return this.store.find('badge',params.badge_id);
},
renderTemplate: function() {
this.render('categories',{outlet: "categoriesList"});
this.render('category',{outlet: "badgeList"});
this.render('badge',{outlet: "body"});
this.render('badge/index',{outlet:'badgeBody',into: "badge"})
}
});
<div class="row">
<div class="col col-lg-12">
{{! Section }}
<h3>Basic Info</h3>
<hr>
{{! Tag Line }}
<div class="row" style="margin-bottom:30px">
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Tag Line</h4>
</div>
{{#view App.EditTagLineView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<div class="container" style="margin-top:1em;">
{{#if short_description}}
{{short_description}}
{{else}}
<span class="text-muted">No Tag Line provided</span>
{{/if}}
<div>
</div>
{{! Description }}
<div class="row">
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Description</h4>
</div>
{{#view App.EditDescriptionView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<div class="container" style="margin-top:1em;">
{{#if full_description}}
{{markdown full_description}}
{{else}}
<span class="text-muted">No description provided</span>
{{/if}}
<div>
</div>
{{! Mentor }}
<div class="row">
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Mentor</h4>
</div>
{{#view App.EditDescriptionView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<div class="container" style="margin-top:1em;">
{{#if mentor}}
Name:{{mentor.employee_preferred_name}}<br>
Email: {{mentor.email}}<br>
Phone: {{mentor.phone}}
{{else}}
wow
{{/if}}
<div>
</div>
</div>
</div>
{{!--
<div class="row">
<div class="col col-lg-12">
<h3>Basic Info</h3>
<hr>
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>Tag Line</h4>
</div>
{{#view App.EditTagLineView}}
<h4 {{bindAttr class=":glyphicon isEditingTagLine:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<p>
{{#if isEditingTagLine}}
{{view Ember.TextField valueBinding="short_description" class="form-control" style="padding-top:10px"}}
<hr>
<button {{action saveTagLine}} class="btn btn-success">Save</button>
{{else}}
{{#if short_description}}
{{short_description}}
{{else}}
No tag line provided
{{/if}}
{{/if}}
</p>
<div class="row page-header-title">
<div class="col col-lg-11">
<h4>
Description
</h4>
</div>
{{#view App.EditDescriptionView}}
<h4 {{bindAttr class=":glyphicon isEditingDescription:glyphicon-nothing:glyphicon-pencil :edit-button"}}></h4>
{{/view}}
</div>
<p>
{{#if isEditingDescription}}
{{view Ember.TextArea valueBinding="full_description" class="form-control" rows="6"}}
<hr>
<button {{action saveDescription}} class="btn btn-success">Save</button>
<a href="http://daringfireball.net/projects/markdown/syntax" target="new" class="btn btn-link"><span class="glyphicon glyphicon-info-sign"></span> More on Markdown </a>
{{else}}
{{#if full_description}}
{{markdown full_description}}
{{else}}
<span class="text-muted">no description provided</span>
{{/if}}
{{/if}}
</p>
</div>
</div>
<div class="row page-header-title" >
<div class="col col-lg-11">
<h4>
Mentor
</h4>
</div>
<div class="col col-lg-1">
<h4 class="glyphicon glyphicon-pencil edit-button"></h4>
</div>
</div>
{{#if mentor}}
<address>
{{log mentor}}
<strong> {{mentor.employee_preferred_name}}</strong>
<br>
{{#if mentor.phone}}
<abbr title="Phone">P:</abbr> {{mentor.phone}} <br>
{{else}}
<small> no phone number provided </small> <br>
{{/if}}
{{#if mentor.email}}
<abbr title="Email">E:</abbr> {{mentor.email}}
{{else}}
<small> no email number provided </small> <br>
{{/if}}
</address>
{{/if}}
</div>
</div>
--}}
{{!节}
基本信息
{{!标记行}
标记线
{{{#view App.EditTagLineView}
{{/view}
{{{if short_description}
{{short_description}}
{{else}
未提供标记线
{{/if}
{{!描述}
描述
{{{#查看应用程序.EditDescriptionView}
{{/view}
{{{如果是完整描述}
{{markdown full_description}}
{{else}
没有提供说明
{{/if}
{{!导师}
导师
{{{#查看应用程序.EditDescriptionView}
{{/view}
{{{如果导师}
姓名:{{mentor.employee_preferred_Name}}
电子邮件:{{mentor.Email}}
电话:{{mentor.Phone}
{{else}
哇!
{{/if}
{{!--
基本信息
标记线
{{{#view App.EditTagLineView}
{{/view}
{{#如果isEditingTagLine}
{{view Ember.TextField valueBinding=“short_description”class=“form control”style=“padding top:10px”}
拯救
{{else}
{{{if short_description}
{{short_description}}
{{else}
未提供标记线
{{/if}
{{/if}
描述
{{{#查看应用程序.EditDescriptionView}
{{/view}
{{#如果是编辑描述}
{{view Ember.TextArea valueBinding=“full_description”class=“form control”rows=“6”}
拯救
{{else}
{{{如果是完整描述}
{{markdown full_description}}
{{else}
没有提供说明
{{/if}
{{/if}
导师
{{{如果导师}
{{log mentor}}
{{mentor.employee_preferred_name}}
{{{#如果是mentor.phone}
P:{{mentor.phone}}
{{else}
没有提供电话号码
{{/if}
{{{if mentor.email}
E:{{mentor.email}
{{else}
没有提供电子邮件号码
{{/if}
{{/if}
--}}
能否提供您的路由器以及在脚本标签中定义的徽章模板的名称?这将非常有帮助
我建议将您的徽章路径重命名为App.BadgeIndexRoute
,并使用名为Badge/index
的模板
我最近遇到了一个问题,原因是我没有使用正确的路线和模板