如何在仅HTML自定义元素（Aurelia）中指定双向可绑定属性

Question

我创建了一个仅HTML的自定义元素来表示输入以及与之相关的所有DOM结构。

我在模板上设置了可绑定属性，以便为元素提供值。但是，我没有看到指定bindable应该是双向的方法。

元素：

bytearray

我知道每次使用元素时我都可以指定双向绑定（例如<template bindable="label,name,placeholder,value"> <div class="form-group"> <label class="control-label col-sm-2" for.bind="name">${label}</label> <div class="col-sm-7 col-md-6"> <input class="form-control" id.bind="name" placeholder.bind="placeholder" value.bind="value" /> </div> </div> </template> ，但是我想设置默认值而不必创建和维护一个单独的类（即我喜欢html-only元素对于这种情况）。

这可能吗？

Answer 1

我不认为这可能是一种简单的方式。我的意思是，你可以弄清楚如何以某种方式覆盖默认行为（[source]，[source]），但很可能你最终会有几个类需要维护。

Documentation很清楚：

  

您甚至可以在HTML Only Custom Element上拥有可绑定属性。这些属性默认为单向数据绑定，但您无法更改默认值，但在绑定到自定义元素时仍可以自由显式设置绑定方向。

在我看来，使用.two-way显式绑定是最简单的选择。

<my-element value.two-way="firstName"></my-element>