RactiveJS 迭代器 (for) 结构

Question

我想知道，例如，我有number_of_fields => 2，我想显示两个这样的输入文本：

{{ # number_of_fields }}
   <input type="text" />
{{ / fields }}

这样做，显然会导致一个输入，因为我传递的参数（number_of_fields）实际上是一个简单的元素。我试图完成的是 CV 生成器中的"添加新字段"功能，我想使用 ractive "自动"完成，而不仅仅是使用 JS 手动单击添加新element。

Answer 1

我找到了一种我认为非常有用的方法。即使有任何"简单"或自然的方法可以在RactiveJS中for，我们可能仍然需要binding或controlling数据，所以如果我们有这个：

{

{ # fields_number：num }} {{/字段 }}

这是绑定这些价值观的方法，我相信我们都同意。现在，我刚才在这里问 https://stackoverflow.com/questions/25460380/的情况是完全相同的。

但后来它打动了我！

我想过x null values array，x在我的情况下会是number of inputs。

...
data : {
    groups : [ 'group1', 'group2', ...],
    fields : { 
        group1 : [ null, null ],
        group2 : [ null, null, null ],
        ...
}
...

然后，将数据

直接绑定到这些值中会更容易，如下所示：

{{ # groups:number }}
    <div id="{{ . }}">
        {{ # fields[ groups[ number ] ]:index }}
            <input type="text" value="{{ fields[ groups[ number ] ][ index ] }}" />
        {{ / fields }}
    </div>
{{ / groups }}

现在，您有一个ractive.get( 'fields' )完全绑定的数据:)。希望这有帮助！