Question

我目前正在使用Aurelia构建一个动态表单，即一个定义为JSON对象的表单。此结构定义还将包含应在运行时解析的松散绑定表达式。一个非常简单的例子如下所示：

[
  {
    "type": "text",
    "text": "Welcome {person:details.firstName} {person:details.lastName}!"
  },
  {
    "type": "checkbox",
    "checked": false,
    "bindings": {
      "checked": "person:isInterested"
    }
  }
]

所以绑定表达式可能是＆＃34; inline＆＃34; （如果相应的属性是一个字符串，并且只需要一个单向绑定。如果该属性不是字符串或需要双向绑定，则它将通过bindings-object定义。

渲染表单本身不是问题（我已通过dynamic UI composition完成此操作）。我也写了一个数据提供者，其接口看起来像这样

registerSource(prefix, object)
getValue(expression) -> object
setValue(expression, value)
parseString(string) -> string

这允许注册应该用作源的对象（例如上面示例中使用的person对象）。此外，它可以根据示例中显示的表达式语言获取和设置值，例如getValue（＆＃39; person：details.firstName＆＃39;）将解析表达式，如果名称为＆＃34; person＆＃34;已注册并返回字符串＆＃34; John＆＃34;。 parseString（＆＃39; Hello {person：details.firstName}！＆＃39;）将返回字符串＆＃34; Hello John！＆＃34;。

数据提供者是必需的，因为它还必须处理级联，即getValue（＆＃39; person：greeting＆＃39;） - ＆gt; ＆＃34;亲爱的John Doe＆＃34;如果是人：问候语解决为＆＃34;亲爱的$ {person：first} $ {person：last}＆＃34;。

我目前正在努力实施。

一种简单的方法是在元素的视图模型中添加数据提供程序，例如

…
get checked() {
  let expression = …; // get expression from the json definition
  return this._dataProvider.getValue(expression);
}

set checked(checked) {
  let expression = …; // get expression from the json definition
  this._dataProvider.setValue(expression, checked);
}
…

这样可行，但如果刷新数据源，则不会通知视图（即刷新）。当然，有可能触发一个刷新视图的事件，但这感觉就像一个解决方案。

有没有人更好地了解如何解决这个问题？绑定行为会成为解决方案吗？我真的很感激这里的任何帮助或提示。

谢谢！

Aurelia的动态形式

0 个答案: