我有一个帮助方法,可以将数字映射到文本 -
Ember.Handlebars.helper('getStatusText', function (value, options) {
switch(value) {
case 1: return "Fresh";
break;
case 2: return "Callback";
break;
default: return "Unable to get Status";
}
});
我可以使用{{getStatusText 1}}
但是如何在ObjectController中的动作中使用帮助器?
Test.DealController = Ember.ObjectController.extend({
selectedStatusType: null,
statusList: ["Fresh","Callback"],
actions: {
updateStatus: function(deal) {
// How do I call the handlebars helper here ?
console.log({{getStatusText 1}});
}
},
});
这显然不起作用。
还有什么方法?
为了更好地理解,这里是jsbin
答案 0 :(得分:25)
使用ember-cli可以这样做:
// helpers/foo.js
export function foo(params) {
return params;
}
export default Ember.Helper.helper(foo);
Helper foo
导出一个函数(包含辅助逻辑)和包装在Ember帮助器中的函数(用于模板)。
// helpers/bar.js
import { foo } from '<project>/helpers/foo';
export function bar(params) {
return foo(params);
}
export default Ember.Helper.helper(bar);
Helper bar
从foo
导入辅助函数,并在其自己的模板助手中使用它。
答案 1 :(得分:4)
将逻辑拉出帮助程序,使其可由助手调用,也可由非把手辅助项目调用。将其解析为车把模板并对其进行评估使其过于复杂化。
你把它归结为你,你可以将它命名为你的应用程序,或者只是将它创建为与你的助手一起生活的功能。
function getStatusText(value){
switch(value) {
case 1: return "Fresh";
break;
case 2: return "Callback";
break;
default: return "Unable to get Status";
}
}
Ember.Handlebars.helper('getStatusText', function (value, options) {
return getStatusText(value);
});
答案 2 :(得分:3)
大多数助手都很简单。在这种情况下,exporting a vanilla function
是要走的路。将函数准确传递给所需的数据。
对于更复杂的用例,Ember也有class-based helpers。他们可以利用其他容器依赖项。您仍然可以使用基于类的帮助程序var data = {};
$('a.play-video').click(function(){
var currentLocation = window.location;
var fullurl = window.location.href;
var key = fullurl.split("sendx")[1];
var sinvnword = $('.question-label.active').last().text();
console.log(sinvnword);
data[key] = sinvnword;
console.log(AXY + "GETIT");
console.log(AXY+"mor");
console.log(AXY + "muerte");
});
方法调用导出的vanilla函数。
但是,函数的参数列表可能会对其他调用者不熟练。
compute
要从容器查找中受益,而不是调用vanilla函数,您可以手动实例化这样的帮助程序并自己调用import Helper from 'ember-helper';
import service from 'ember-service/inject';
export function vanillaFunction(imageService, userService, foo, bar, baz, dependency3, options) {
...
}
export default Helper.extend({
imageService: service('image'),
userService: service('user'),
compute(positionalParams, hashParams) {
return vanillaFunction(this.get('imageService'), this.get('userService'), positionalParams[0], positionalParams[1], ...);
},
});
。这是罕见的。但它受益于一个小的界面,与您在模板中调用它的方式一致。帮助程序通常由HTMLBars实例化,以便在模板中使用,该模板具有特殊的上下文和观察规则。所以有一个小箍跳跃在你的内部使用它控制器。
compute