我正在尝试使用amp-list解析我的复杂json文件。但是有一个大问题。如果我渲染了json文件，请amp-list在html文件中添加额外的节点/标签。会是什么问题？我可以直接在json文件中使用图片元素吗？我怎样才能把同一目录中的不同元素？例如：images[0]。
我的产品html页面
<amp-list src="./api/products.json" height="400" width="auto" items="." layout="fixed-height">
<template type="amp-mustache">
{{#module}}
{{#tabs}}
{{#products}}
{{#data}}
<amp-carousel width="377" height="377" layout="fixed">
{{#aggregatedColorSwatches}}
{{#shot}}
{{#images}}
{{#desktop}}
<amp-img src="{{ url }}" width="377" height="377"> </amp-img>
{{/desktop}}
{{/images}}
{{/shot}}
{{/aggregatedColorSwatches}}
</amp-carousel>
{{/data}}
{{/products}}
{{/tabs}}
{{/module}}
</template>
</amp-list>
输出：
<amp-list>
<template type="amp-mustache">
{{#module}}
{{#tabs}}
{{#products}}
{{#data}}
<amp-carousel width="377" height="377" layout="fixed">
{{#aggregatedColorSwatches}}
{{#shot}}
{{#images}}
{{#desktop}}
<amp-img src="{{ url }}" width="377" height="377"> </amp-img>
{{/desktop}}
{{/images}}
{{/shot}}
{{/aggregatedColorSwatches}}
</amp-carousel>
{{/data}}
{{/products}}
{{/tabs}}
{{/module}}
</template>
<div role="list" class="i-amphtml-fill-content i-amphtml-replaced-content">
<div role="listitem"></div>
<div role="listitem">
<amp-carousel
layout="fixed"
height="377"
width="377"
class="i-amphtml-element i-amphtml-layout-fixed i-amphtml-layout-size-defined i-amphtml-layout"
i-amphtml-layout="fixed"
style="width: 377px; height: 377px;"
>
<div class="i-amphtml-scrollable-carousel-container">
<amp-img
height="377"
width="377"
src=""
class="amp-carousel-slide amp-scrollable-carousel-slide i-amphtml-element i-amphtml-layout-fixed i-amphtml-layout-size-defined i-amphtml-layout"
i-amphtml-layout="fixed"
style="width: 377px; height: 377px;"
>
<img
decoding="async"
src=""
class="i-amphtml-fill-content i-amphtml-replaced-content"/></amp-img
><amp-img
height="377"
width="377"
src=""
class="amp-carousel-slide amp-scrollable-carousel-slide i-amphtml-element i-amphtml-layout-fixed i-amphtml-layout-size-defined i-amphtml-layout"
i-amphtml-layout="fixed"
style="width: 377px; height: 377px;"
>
<img
decoding="async"
src=""
class="i-amphtml-fill-content i-amphtml-replaced-content"
/></amp-img>
</div>
<div
tabindex="0"
class="amp-carousel-button amp-carousel-button-prev amp-disabled i-amphtml-screen-reader"
role="button"
aria-disabled="true"
></div>
<div
tabindex="0"
class="amp-carousel-button amp-carousel-button-next i-amphtml-screen-reader"
role="button"
aria-disabled="false"
></div
></amp-carousel>
<amp-carousel
layout="fixed"
height="377"
width="377"
class="i-amphtml-element i-amphtml-layout-fixed i-amphtml-layout-size-defined i-amphtml-layout"
i-amphtml-layout="fixed"
style="width: 377px; height: 377px;"
>
<div class="i-amphtml-scrollable-carousel-container">
<amp-img
height="377"
width="377"
src=""
class="amp-carousel-slide amp-scrollable-carousel-slide i-amphtml-element i-amphtml-layout-fixed i-amphtml-layout-size-defined i-amphtml-layout"
i-amphtml-layout="fixed"
style="width: 377px; height: 377px;"
>
<img
decoding="async"
src=""
class="i-amphtml-fill-content i-amphtml-replaced-content"/></amp-img
><amp-img
height="377"
width="377"
src=""
class="amp-carousel-slide amp-scrollable-carousel-slide i-amphtml-element i-amphtml-layout-fixed i-amphtml-layout-size-defined i-amphtml-layout"
i-amphtml-layout="fixed"
style="width: 377px; height: 377px;"
>
<img
decoding="async"
src=""
class="i-amphtml-fill-content i-amphtml-replaced-content"
/></amp-img>
</div>
<div
tabindex="0"
class="amp-carousel-button amp-carousel-button-prev amp-disabled i-amphtml-screen-reader"
role="button"
aria-disabled="true"
></div>
<div
tabindex="0"
class="amp-carousel-button amp-carousel-button-next i-amphtml-screen-reader"
role="button"
aria-disabled="false"
></div
></amp-carousel>
<amp-carousel
layout="fixed"
height="377"
width="377"
class="i-amphtml-element i-amphtml-layout-fixed i-amphtml-layout-size-defined i-amphtml-layout"
i-amphtml-layout="fixed"
style="width: 377px; height: 377px;"
>
<div class="i-amphtml-scrollable-carousel-container">
<amp-img
height="377"
width="377"
src=""
class="amp-carousel-slide amp-scrollable-carousel-slide i-amphtml-element i-amphtml-layout-fixed i-amphtml-layout-size-defined i-amphtml-layout"
i-amphtml-layout="fixed"
style="width: 377px; height: 377px;"
>
<img
decoding="async"
src=""
class="i-amphtml-fill-content i-amphtml-replaced-content"/></amp-img
><amp-img
height="377"
width="377"
src=""
class="amp-carousel-slide amp-scrollable-carousel-slide i-amphtml-element i-amphtml-layout-fixed i-amphtml-layout-size-defined i-amphtml-layout"
i-amphtml-layout="fixed"
style="width: 377px; height: 377px;"
>
<img
decoding="async"
src=""
class="i-amphtml-fill-content i-amphtml-replaced-content"
/></amp-img>
</div>
<div
tabindex="0"
class="amp-carousel-button amp-carousel-button-prev amp-disabled i-amphtml-screen-reader"
role="button"
aria-disabled="true"
></div>
<div
tabindex="0"
class="amp-carousel-button amp-carousel-button-next i-amphtml-screen-reader"
role="button"
aria-disabled="false"
></div
></amp-carousel>
</div>
<div role="listitem"></div>
<div role="listitem"></div>
<div role="listitem"></div>
<div role="listitem"></div>
<div role="listitem"></div></div
></amp-list>