Question

我的Json回复是这样的

{
  requests=[
    {
      updateCells={
        fields=userEnteredValue,
        rows=[
          {
            values=[
              {
                userEnteredValue={
                  stringValue=My text
                }
              }
            ]
          }
        ],
        start={
          columnIndex=6,
          rowIndex=178,
          sheetId=XXXXX
        }
      }
    }
  ]
}

我必须创建嵌套的手风琴。但是问题是这种嵌套永远不会结束。一个孩子可以没有任何。的孩子，那个孩子可以没有。的孩子等等。

所以我将如何像html中的手风琴一样显示它。我正在使用Angular。

我当时想我可以为父母和孩子创建两个单独的组件。

  [  
   {  
      "name":"A",
      "price":50,
      "children":[  
         {  
            "name":"AA",
            "price":150,
            "children":[  
               {  
                  "name":"AAA",
                  "price":50,
                  "children":null
               }
            ]
         },
         {  
            "name":"AB",
            "price":766,
            "children":null
         }
      ]
   },
   {  
      "name":"B",
      "price":78,
      "children":[  
         {  
            "name":"C",
            "price":150,
            "children":null
         }
      ]
   },
   {  
      "name":"C",
      "price":453,
      "children":null
   }
]

Answer 1

这可以通过将相同的组件与输入属性嵌套来轻松完成。下面的模板应该给您提示

<ul *ngIf="data">
    <li *ngFor="let item of data">{{item.name}}:{{item.price}}
        <hello [data]="item.children"></hello>
    </li>
</ul>

https://stackblitz.com/edit/angular-nested-tree上的Stackblitz

要记住的一件事是嵌套级别，如果它们太深，则可能会引发堆栈溢出错误。

嵌套手风琴（手风琴内的手风琴内的手风琴等）

1 个答案: