写帮助者（Writing Helpers）

优质

小牛编辑

130浏览

2023-12-01

您可以向模板添加额外的功能，并将模型和组件的原始值转换为适合用户的格式。如果您多次使用HTML应用程序，则可以从任何Handlebars模板添加自定义帮助程序。如果当前上下文发生更改，则Ember.js将自动执行帮助程序并使用更新的值更新DOM。

语法 (Syntax)

export function Helper_Name([values]) {
   //code here
}
export default Ember.Helper.helper(Helper_Name);

下表列出了使用帮助程序名称的不同方法 -

S.No.	帮助者姓名和描述
1	Helper Arguments 您可以通过在帮助程序名称后指定将多个参数传递给帮助程序。
2	命名参数您可以传递命名参数以及相关值。
3	转义HTML内容它用于在显示结果时转义HTML标记。

例子 (Example)

下面给出的示例实现了helper，它需要多个输入并返回单个输出。使用以下命令创建一个新助手 -

ember generate helper helper-name

在这个例子中，我们创建了一个名为writinghelper的帮助writinghelper 。现在打开在app/helpers/下创建的writinghelper.js文件。

import Ember from 'ember';
export function formatHelper([value]) {
   let var1 = Math.floor(value * 100);
   let cents = value % 100;
   let var3 = '$';
   if (cents.toString().length === 1)
   return `${var3}${var1}`;
}
export default Ember.Helper.helper(formatHelper);

您可以在花括号内的模板中使用“writinghelper”帮助器。打开index.hbs文件并编写以下代码 -

Value is : {{writinghelper 5}}
{{outlet}}

在上面的代码中，我们已经在模板中传递了辅助值，该值将美分数显示为格式化字符串。

输出 (Output)

运行ember服务器; 你会收到以下输出 -