使用EmberJS和JSON模式即时生成表单？

Question

我搜索并发现了这个问题(基于GUI或基于Web的JSON编辑器,类似于属性资源管理器),它有几个链接到从JSON生成UI的资源.

我对任何显示使用JSON Schema(http://json-schema.org/)的emberjs 生成动态表单的示例或已知项目感兴趣.项目如:

• Alpacajs(http://www.alpacajs.org)
• json-editor(https://github.com/jdorn/json-editor)

有任何想法吗？

Answer 1

是的，您可以根据某些 JSON 动态生成表单。

您需要将 JSON 对象映射到路由器（或控制器）中的键数组中：

model: function() {
  var json = {a: 'red', b: 'yellow', c: 'blue'};
  var items = [], key;
  for (key in json) {
    if (json.hasOwnProperty(key)) {
      items.push({name: key, value: json[key]});
    }
  }
  return items;
}

只需使用each您认为的帮助器即可：

{{#each field in content}}
  {{field.name}}: {{input type="text" value=field.value}}<br>
{{/each}}

我用上面的代码制作了一个可以工作的JSBin 。