我試圖複製this example但沒有成功。我想用一個mustache模板添加一個列表，像這樣：嘗試實現放大器鬍子的錯誤

<ul> 
    <amp-list width=auto 
       height=100 
       layout=fixed-height 
       src="/assets/popular.json"> 
      <template type="amp-mustache" 
        id="amp-template-id"> 
       <li> 
        <a href={{url}}>{{title}}</a> 
       </li> 
      </template> 
    </amp-list> 
</ul>

我/assets/popular.json文件是：

{ 
"items": [ 
    { 
    "title": "amp-carousel", 
    "url": "https://ampbyexample.com/components/amp-carousel" 
    }, 
    { 
    "title": "amp-img", 
    "url": "https://ampbyexample.com/components/amp-img" 
    }, 
    { 
    "title": "amp-ad", 
    "url": "https://ampbyexample.com/components/amp-ad" 
    }, 
    { 
    "title": "amp-accordion", 
    "url": "https://ampbyexample.com/components/amp-accordion" 
    } 
] 
}

但我無法得到它的工作，在json的值不會被取代在模板中，我得到這個錯誤：

Missing URL for attribute 'href' in tag 'a'

我不知道爲什麼值{{url}}沒有被正確更換內容爲json。

我在頭部添加了必要的scripts。

來源

2016-07-30 elbaulp

我想你的JSON文件裝入不正確，請在檢查網絡標籤，看看你是否得到該文件。 –

@ShlomiHaver，是的，我正在獲取該文件。 – elbaulp

你可以把我們的代碼放在jsfiddle中嗎？ –

最近我一直在遷移到雨果從傑基爾和麪臨同樣的問題。以下是兩者的解決方案。

傑奇

現在解決了，問題是我使用jekyll，所以標籤{{tag}}都被解釋爲一個liquid tag。我解決了它寫這樣的代碼：

<ul> 
<amp-list width=auto 
    height=100 
    layout=fixed-height 
    src="/assets/popular.json"> 
    <template type="amp-mustache" 
     id="amp-template-id"> 
    <li> 
     <a href="{% raw %}{{url}}{% endraw %}">{% raw %}{{title}}{% endraw %}</a> 
    </li> 
    </template> 
</amp-list> 
</ul>

更新：我已經寫了more detailed explanation

雨果

<ul> 
<amp-list width=auto 
    height=100 
    layout=fixed-height 
    src="/assets/popular.json"> 
    <template type="amp-mustache" 
     id="amp-template-id"> 
    <li> 
     <a class="card related" id={{"{{id}}"}} {{ printf "href=%q" ""{url}}" | safeHTMLAttr }}> 
     {{"{{title}}"}} 
     </a> 
    </li> 
    </template> 
</amp-list> 
</ul>

來源

2016-07-30 12:36:43 elbaulp

嘗試實現放大器鬍子的錯誤

回答

傑奇

雨果

相關問題