使用 Rivets.js 访问数组索引

Question

我想知道为什么访问绑定在 rivets.js 中的数组索引与 .运算符，而不是 [] 的标准访问方式。

例如

假设我们绑定

var binding = {name: "binding", arr: [0,1,2]}
rivets.bind(document, {binding: binding});

那么在我们的 html 中，如果我们这样做，它将不起作用

<span> {binding.arr[0]}</span>

但如果我们这样做

 <span> {binding.arr.0}</span>

成功访问数组的第0个元素。

在铆钉中的什么地方记录了这种行为？这是在模板引擎中访问数组元素的标准方式吗？我无法在任何地方找到它，这真的很困扰我。

Answer 1

<span> {binding.arr.0}</span> 有效，因为数组是对象。所以它的工作方式与其他对象使用 . 运算符的方式相同 (returns obj[key]).

理想情况下，在使用数组时，您应该使用 rv-each.

出于某种原因，如果您必须访问特定索引处的项目并且对 <span> {binding.arr.0}</span> 看起来令人困惑或不可读感到不安，我建议按照以下行创建格式化程序：

rivets.formatters.itemat = function(value,index){
  if(!(value && value instanceof Array))
    return null; // throw some error if required
  return value[index || 0];
}

可以像

一样使用

<span> {binding.arr | itemat 0}</span>

使用 Rivets.js 访问数组索引

Accessing array index with Rivets.js

javascript

html

arrays

templating

rivets.js