根据数据源中的记录动态创建小部件答案

【问题标题】：Dynamically create widgets based on records in a datasource根据数据源中的记录动态创建小部件
【发布时间】：2018-09-25 12:03:47
【问题描述】：

（提前为措辞不当的问题道歉。）

不确定这是否可能 - 无法找到任何有关此的文档...

我有一个数据源，其记录包含证书信息字段。
对于数据源中的每条记录，我想在指定面板上创建一个标签小部件。（该面板已在应用制作者页面上创建。）

打算在下面放一些伪代码来展示我希望实现的目标：

var length = app.datasources.Certificates.items.length;
var records = app.datasources.Certificates.items;

for (var i =0; i <length; i++){
app.pages.A_Edit_Certificate_Requirements.descendants.Panel1.createNewWidget(label,text = records[i].Certificate_Name) 
}

.newWidget(小部件的类型，要配置的小部件的属性)是伪部分。

有人知道这样的事情是否可能吗？我希望通过这种方法做到这一点的原因是尽可能保持页面动态。

【问题讨论】：

您是否考虑过仅使用内置网格小部件并将标签插入网格单元面板中？这将完成相同的事情，因为网格小部件会自动为您的数据源项创建子单元格面板的数量。然后，您可以根据自己的标签布局需求设置单元格面板的样式。
已经在尝试上述方法。似乎有点工作。只是努力从表中提取值。会弄清楚的。还是谢谢。
只需将网格小部件的数据源绑定到“证书”，然后将标签拖到单元格面板中并将标签的值设置为 datasource.item.Certificate_Name。事实上，如果您的网格已经绑定到您的数据源，那么这应该是您的选项之一，并且一旦您在值属性上选择绑定，它应该会自动生成一个包含一些可选数据源项值的下拉列表。动态创建元素将变得更加复杂。
使用 a 表和以下代码得到了这个工作： var results = widget.root.descendants.Table1Body.children._values; console.log(results[0].descendants.Field.text);

标签： google-app-maker

【解决方案1】：

如果您确实想自己继续动态创建标签，这里将提供一些示例代码来完成相同的操作。为了使它工作，您的面板数据源需要设置为“证书”，并且代码需要附加到面板的 onDataLoad 事件：

widget.datasource.items.forEach(function(item) {
  var node = document.createElement('div');
  node.className = 'app-Label';
  node.style.margin = '8px';
  node.textContent = item.Certificate_Name;
  widget.getElement().appendChild(node);
});

【讨论】：

哇，这确实有点用。谢谢马库斯，给了我一些可以修补的东西。