AMP Mustache模板{{name}}无法渲染JSON响应数据问题排查

核心原因 #

amp-list组件默认会直接遍历顶层的JSON数组，但你的服务器响应是一个包含items子数组的对象，模板无法直接定位到数组内的name字段，导致占位符无法渲染数据。

解决方法 #

在amp-list标签中添加items="items"属性，明确告诉组件要遍历的数据源是响应对象里的items数组：

<amp-list width="auto" height="100" layout="fixed-height" 
      src="https://example.com/index.php?route=information/places/search" 
      [src]="'https://example.com/index.php?route=information/places/search&amp;q=' + query"
      items="items">
<template type="amp-mustache">
    <div class="autocomplete-suggestion" role="button" tabindex="0">
        Name: {{name}}
    </div>
</template>
<div placeholder>Loading...</div>
<div fallback>No results found.</div>
</amp-list>

额外检查项 #

1. 确认服务器返回的响应头Content-Type为application/json，AMP对JSON响应的MIME类型有严格校验，非标准类型可能导致解析异常。
2. 确保amp-list标签已正确闭合（你的原代码片段中缺少闭合标签，需补充）。

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