如何基于数组参数动态渲染Adaptive Card表格行？

核心思路 #

利用Adaptive Card的Repeater组件遍历aggregations>query>buckets数组，结合ColumnSet模拟表格结构，实现动态生成包含key和doc_count的表格行。

具体配置示例 #

1. Adaptive Card Designer中的配置（可视化调试用）

直接使用你提到的${body.aggregations.query.buckets}绑定数组，完整Card结构如下：

{
  "type": "AdaptiveCard",
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "version": "1.4",
  "body": [
    // 表格表头
    {
      "type": "ColumnSet",
      "columns": [
        {
          "type": "Column",
          "width": "auto",
          "items": [
            {
              "type": "TextBlock",
              "text": "查询关键词",
              "weight": "Bolder",
              "size": "Medium"
            }
          ]
        },
        {
          "type": "Column",
          "width": "auto",
          "items": [
            {
              "type": "TextBlock",
              "text": "出现次数",
              "weight": "Bolder",
              "size": "Medium"
            }
          ]
        }
      ]
    },
    // 动态生成表格行的Repeater
    {
      "type": "Repeater",
      "$data": "${body.aggregations.query.buckets}",
      "items": [
        {
          "type": "ColumnSet",
          "spacing": "Small",
          "columns": [
            {
              "type": "Column",
              "width": "auto",
              "items": [
                {
                  "type": "TextBlock",
                  "text": "${key}",
                  "wrap": true
                }
              ]
            },
            {
              "type": "Column",
              "width": "auto",
              "items": [
                {
                  "type": "TextBlock",
                  "text": "${doc_count}",
                  "wrap": true
                }
              ]
            }
          ]
        }
      ]
    }
  ]
}

2. 工作流（如Power Automate）中的适配调整

如果是在Power Automate等工具中发送卡片，需要将Adaptive Card的表达式替换为工具原生语法：

• Repeater的$data属性改为：@{body('Parse_JSON')?['aggregations']?['query']?['buckets']}
• 表格行的key和doc_count绑定改为：@{item()?['key']} 和 @{item()?['doc_count']}

关键注意事项 #

• 确保Parse JSON动作的Schema正确匹配原始响应结构，否则无法正常解析嵌套的buckets数组。
• 选用Adaptive Card版本≥1.0（推荐1.4），Repeater组件在该版本及以上支持。
• 如果需要美化表格样式，可以给ColumnSet添加separator: true属性，实现行分隔线效果。

内容的提问来源于stack exchange，提问作者Darren Lau