奥雷利亚作曲

Question

关于Aurelia的<compose>元素的快速问题。我曾希望使用它将自定义元素作为窗体控件插入，如下所示：

<!-- Loop through form controls -->
<div class="form-group" repeat.for="control of controls">
  <label><span t="${control.label}"></span></label>
  <compose view-model="resources/elements/${control.type}/${control.type}" 
    value.bind="control.value" data.bind="control.data" placeholder.bind="control.placeholder"></compose>
</div>

但是，<compose>元素开始被限制为只接受model、view-model和view参数。对吗？基于value、data、placeholder等参数传递给自定义元素的最佳方法是什么？

用我的解决方案编辑：

最后，看起来奥雷利亚的<compose>只适用于view、view-model和model属性。我的解决方案是传递所有数据(可以是作为单个对象传递的多个项)，如下所示：

<compose view-model="resources/elements/${control.type}/${control.type}" 
         model.bind="{'control': control, 'model': model, 'readonly': readonly}">
</compose>

我发现有趣的是，当您使用model.bind时，您不需要使用@bindable装饰器来接收参数。他们马上就可以看到了。

Answer 1

使用model.bind怎么样？

<!-- Loop through form controls -->
<div class="form-group" repeat.for="control of controls">
  <label><span t="${control.label}"></span></label>
  <compose view-model="resources/elements/${control.type}/${control.type}"
    model.bind="control"></compose>
</div>

然后，视图模型将可以从其value属性访问data和placeholder .