Question

我使用JsViews来呈现列表，但首先通过辅助函数传递列表，如下所示：

<ul>
  {^{for ~filter(list, 'xyz')}}
    <li>...</li>
  {{/for}}
</ul>

其中filter根据list创建一个新列表，其中只有部分原始元素基于过滤条件。问题是，当我更新list时：

$.observable(data.list).insert(list.length, { ... });

{^{for ...}}未被重新评估。但是，如果我删除过滤器，请将{^{for ...}更改为：

{^{for list}}
  ...
{{/for}}

然后一切都按预期工作。有没有办法实现我追求的目标？似乎JsViews应该能够做我想做的事情，因为这个答案很相似：JsViews: Converter before helper function in data-link。

Answer 1

@Jrop：现在，你的解决方法是有道理的。您的场景涉及JsObservable的一些未来功能，因为链接数组具有定义源阵列和目标阵列之间关系的转换（例如，过滤器，排序或页面）。只要源内的可观察更改导致其内容发生更改，目标就会引发阵列更改事件。

当前可观察的API应该可以在今天实现，但是在JsViews中开箱即用的半声明方法尚不可用。

另一种方法可能是衍生自{{for_with_filtering ...}}的衍生{{for}}标记，但您可以选择包含过滤器：{{forplus list filter=~filter('xyz')}}。我将很快发布一个相关的样本，显示{{for}}，它允许您设置迭代的开始和整数。（{{for_range ...}}）。

Answer 2

好的，所以我找到了一个解决方法，虽然我确实希望@BorisMoore能够权衡这个！

解决方案是手动更新视图，因为过滤后的数据不会===绑定数据（我猜）。所以不要这样做：

$.observable(data.list).insert(data.list.length, item);

我改为：

data.list.push({...});
$.view('#target', true, 'data').refresh();

#target是保存已呈现内容的目标<div>的选择器。

同样，如果@BorisMoore可以权衡这一点，我真的很高兴，因为这个解决方案刷新了一大块视图，而不是逐步添加一个项目（根据我的理解）。

JsViews：使用辅助函数进行数据链接

2 个答案: