Javascript 在绑定帮助器中为模板设置正确的上下文
我需要有关此代码的帮助:Javascript 在绑定帮助器中为模板设置正确的上下文,javascript,ember.js,handlebars.js,Javascript,Ember.js,Handlebars.js,我需要有关此代码的帮助: View Setting up the Grid Helper ------------------------------- App.OrdersTableView = Em.View.extend({ templateName: 'account/orders/table', grid: App.HelperGrid.extend({ meta: [ { 'name': '
View Setting up the Grid Helper
-------------------------------
App.OrdersTableView = Em.View.extend({
templateName: 'account/orders/table',
grid: App.HelperGrid.extend({
meta: [
{
'name': 'id',
'text': 'Number',
'cellCallback': function(content, model){
// Uncaught Error: assertion failed: Cannot call get with 'id' on an undefined object.
// return '{{#linkTo orders.view model}}' + content + '{{/linkTo}}';
// Renders an empty column
// return '{{#with model}}{{#linkTo orders.view model}}' + content + '{{/linkTo}}{{/with}}';
// Will render a link, linking to /account
return '{{#linkTo account}}' + content + '{{/linkTo}}';
}
},
{
'name': 'shortDate',
'text': 'Date'
},
{
'name': 'orderedBy',
'text': 'Ordered By',
'cellCallback': function(content){
return '{{view rangeView}}';
}
},
{
'name': 'orderTotalOneTimeAmount',
'text': 'One-Time Total',
'cellCallback': function(content){
return '$' + parseFloat(content).toFixed(2);
}
},
{
'name': 'orderTotalRecurringAmount',
'text': 'Monthly Total',
'cellCallback': function(content){
return '$' + parseFloat(content).toFixed(2);
}
},
{
'name': 'status',
'text': 'Status'
}
]
})
});
DataGrid Helper Template
------------------------
<div class="row">
<div class="span12">
<div class="row">
{{view view.rangeView}}
{{view view.countView}}
{{view view.pagerView}}
</div>
<div class="row">
<div class="span12">
<table class="table table-striped table-bordered">
<thead>
<tr>
{{#each meta in view.meta}}
{{view view.headerView propertyNameBinding="meta.name" labelBinding="meta.text"}}
{{/each}}
</tr>
</thead>
<tbody>
{{#each order in controller}}
{{gridRow view order view.meta}}
{{/each}}
</tbody>
</table>
</div>
</div>
</div>
</div>
gridRow Bound Handlebars Helper
-------------------------------
// I'm aware that I'm appending 'td' child views but returning a '<tr></tr>' string for display. This is not the problem at hand and will be fixed.
/**
* Grid Row bound helper
*
* Used to render a table row in a datagrid.
*
* @param {Object} context Ember.View reference
* @param {Object} model DS.Model containing data for specific row
* @param {Object} properties Meta data to render data cells
* @return {String} HTML to render table row
*/
Ember.Handlebars.registerBoundHelper( 'gridRow', function(context, model, meta) {
var options = [].slice.call(arguments, -1)[0],
view = options.data.view,
returnValue = '';
returnValue += '<tr>';
for ( var i=0, j=meta.length; i<j; i++ ) {
var content = Ember.Handlebars.Utils.escapeExpression( model.get(meta[i].name) ),
template = ( undefined !== meta[i].cellCallback ) ? meta[i].cellCallback( content, model, context ) : content;
var childView = view.createChildView(Ember.View, {
tagName: 'td',
context: context, //Ember.get(view, 'context'),
template: Ember.Handlebars.compile(template)
});
view.appendChild(childView);
}
returnValue += '</tr>';
return new Ember.Handlebars.SafeString(returnValue);
});
查看设置网格辅助对象
-------------------------------
App.OrdersTableView=Em.View.extend({
templateName:'account/orders/table',
网格:App.HelperGrid.extend({
元:[
{
'name':'id',
“文本”:“编号”,
“cellCallback”:函数(内容、模型){
//未捕获错误:断言失败:无法对未定义的对象调用id为的get。
//返回“{{#linkTo orders.view model}}”+内容+“{{/linkTo}}”;
//呈现空列
//返回{{{with model}}{{{linkTo orders.view model}}}}+content+{{/linkTo}}{{/with}}};
//将呈现链接,链接到/帐户
返回“{{#linkTo account}}”+content+“{{/linkTo}}”;
}
},
{
“名称”:“短日期”,
“文本”:“日期”
},
{
'name':'orderedBy',
“文本”:“排序人”,
“cellCallback”:函数(内容){
返回“{view rangeView}}”;
}
},
{
“名称”:“orderTotalOneTimeAmount”,
“文本”:“一次总计”,
“cellCallback”:函数(内容){
返回“$”+parseFloat(内容).toFixed(2);
}
},
{
“名称”:“orderTotalRecurringAmount”,
“文本”:“每月总计”,
“cellCallback”:函数(内容){
返回“$”+parseFloat(内容).toFixed(2);
}
},
{
“名称”:“状态”,
“文本”:“状态”
}
]
})
});
DataGrid辅助模板
------------------------
{{view.rangeView}
{{view view.countView}
{{view.pagerView}
{{{#视图中的每个meta.meta}
{{view view.headerView propertyNameBinding=“meta.name”labelBinding=“meta.text”}
{{/每个}}
{{#控制器中的每个顺序}
{{gridRow view order view.meta}
{{/每个}}
网格绑定把手辅助对象
-------------------------------
//我知道我正在附加'td'子视图,但返回一个''字符串以供显示。这不是当前的问题,将得到解决。
/**
*网格行绑定辅助对象
*
*用于呈现datagrid中的表行。
*
*@param{Object}context-Ember.View引用
*@param{Object}model DS.model包含特定行的数据
*@param{Object}属性元数据以呈现数据单元
*@return{String}HTML以呈现表行
*/
Ember.handlebar.registerBoundHelper('gridRow',函数(上下文、模型、元){
var options=[].slice.call(参数,-1)[0],
视图=options.data.view,
返回值=“”;
返回值+='';
对于(var i=0,j=meta.length;i,我最终找到了答案,答案与我一直怀疑的上下文有关。我将第一个meta.cellCallback定义中的模板定义更改为:
return '{{#linkTo orders.view this}}' + content + '{{/linkTo}}';
然后,我必须适当地设置所创建视图的上下文,因此我将其更改为:
var childView = view.createChildView(Ember.View, {
tagName: 'td',
context: ( -1 === template.indexOf('{{#linkTo') ) ? context : model,
template: Ember.Handlebars.compile(template)
});
这样{{#linkTo}的上下文helper按预期设置为单个模型,其他helper具有父视图的上下文。因此我最终找到了答案,答案与我一直怀疑的上下文有关。我在第一个meta.cellCallback定义中将模板定义更改为:
return '{{#linkTo orders.view this}}' + content + '{{/linkTo}}';
然后,我必须适当地设置所创建视图的上下文,因此我将其更改为:
var childView = view.createChildView(Ember.View, {
tagName: 'td',
context: ( -1 === template.indexOf('{{#linkTo') ) ? context : model,
template: Ember.Handlebars.compile(template)
});
这样{{#linkTo}的上下文helper按预期设置为单个模型,其他helper具有父视图的上下文。我不喜欢用这种方式解析模板来确定上下文。必须有一种方式来自动确定。我不喜欢用这种方式解析模板来确定上下文必须有一种方法自动确定这一点。