检索车把中的专用阵列数据.js模板

Retrieving Private Array Data in Handlebars.js Template

本文关键字:阵列 数据 js 模板 专用 检索      更新时间:2023-09-26

给定这个普通的JavaScript结构:

var MyObject = function() {
  var privateArray = [
    { name: 'one' },
    { name: 'two' }
  ];
  this.returnPrivate = function(index) {
    return privateArray[index];  
  };
};
var obj = new MyObject();

在车把模板中,我希望能够使用 returnPrivate 函数在privateArray的特定索引处打印对象的 name 属性。

// This of course does not work.
<p>{{returnPrivate(1).name}}</p>

我刚刚开始使用车把.js,所以可能已经有一种标准的方法可以做到这一点。 或者这可能是试图在模板中构建太多逻辑,并违背车把的全部内容。

我想出了一个助手来做我需要它的事情,但我非常感谢一些关于这是否是解决此类车把问题的最佳方法的反馈。

/**
 * Given the name of a function that returns an array value, this helper
 * returns the value at a given index.  Optionally it takes a property name
 * in case the array value at the given index is itself an object.
 */
Handlebars.registerHelper('eqf', function(func, index, prop) {
  if (typeof prop === 'string') {
    return func(index)[prop];
  } else {
    return func(index);
  }
});

问题示例的用法:

<p>{{eqf returnPrivate 1 "name"}}</p>

Handlebars 具有用于处理数字或符号标识符的特殊语法,如此处所述。 如果能够将数组索引作为文本传递,则可以使用以下命令:

{{privateArray.[1].name}}

仅当您重构对象以使privateArray可用于模板时,这才有效。 如果确实要隐藏privateArray并强制模板使用函数调用,则必须使用帮助程序。