使用 AMP [AMP-STATE] [AMP-BIND] [AMP-MUSTACHE] 过滤 JSON 数据

Question

我正在努力在 AMP 结构中构建一个库存列表，因为我们网站的其余部分都是使用 AMP 构建的，并且需要能够过滤我的一些数据以实现可用性。这是我目前正在处理的内容的链接：库存列表。

我一直在使用 AMP 示例网站上的产品浏览页面示例作为我如何执行此操作的指南(产品浏览页面(。但是，我似乎根本无法过滤数据。我希望当我从选择菜单中选择"轮式装载机"时，库存列表中的项目会消失。

这是我设置"机器类型"选择菜单的初始代码块，我还有另外两个层用于此过滤，当我尝试让这个层工作时，我目前已注释掉了它们。

<amp-state id="inventory">
<script type="application/json">
{
"Type": "all",
"listSrc": "https://www.craigattachments.com/json/inventory.json?Type=all&_=RANDOM"
}
</script>                
</amp-state>
<amp-list height="60" layout="fixed-height" src="https://www.craigattachments.com/json/inv-dropdowns.json">
<template type="amp-mustache">
<label for="Type">Machine Type</label>
<select id="Type" name="Type" class="inv-dropdown" on="change:AMP.setState({inventory: {Type: event.value,listSrc: 'https://www.craigattachments.com/json/inventory.json?Type='+ event.value +'&_=RANDOM'}})">
<option value="all">Select your machine type</option>
{{#type}}
<option value="{{name}}">{{name}}</option>
{{/type}}
</select>
</template>
</amp-list>

然后，我尝试使用上面的代码来过滤我的列表(下面(，该列表是使用我的 inventory.json 文件填充的。出于测试目的，我缩短了该文件，但它最终将通过我们的ERP系统API进行填充。

<amp-list width="auto" height="150" layout="fixed-height" src="https://www.craigattachments.com/json/inventory.json?Type=all&_=RANDOM'" [src]="inventory.listSrc">  
<template type="amp-mustache">
<div class="inv-list-row">
<div class="inv-list-item inventory">{{SerialNo_SerialNumber}}</div>
<div class="inv-list-item inventory">{{Part_PartNum}}</div>
<div class="inv-list-item inventory">{{Part_PartDescription}}</div>
<div class="inv-list-item inventory">{{Part_CommercialBrand}}</div>
<div class="inv-list-item inventory">{{Part_CommercialSubBrand}}</div>
<div class="inv-list-item inventory">{{Type}}</div>
</div> 
</template> 
</amp-list>

关于我可能缺少什么的任何见解，以便这实际上会在选择菜单更改时过滤我的数据？我假设这是对 JSON 数据中"类型"项的引用问题，但不确定如何建立这种连接。

---

编辑：五月16th，2018

终于让它工作了。决定暂时删除"模型"，但稍后会为其添加功能。

GitHub 代码链接

Answer 1

看起来需要根据提供的 Type 参数在服务器/API 端进行过滤。当类型更改并且它在 URL 中正确设置类型时，获取调用发生在清单列表链接上，但在我测试它时它为两种类型返回相同的 JSON。它的 AMP 位对我来说看起来是正确的。