Handlebars.js是否允許使用動態模板？

Question

我已經開始將Spotify API作為個人學習練習，並從初學者教程開始。

給出的示例代碼使用handlebars.js作為模板，我實際上認為它很酷。 我怎么也找不到想做的事情。

這是我的模板

<script id="recently-played-template" type="text/x-handlebars-template">

    <div class="">
      <dl class="dl-horizontal">
        <h3> Recently Played </h3>

    <p>{{items.0.track.artists.0.name}} - {{items.0.track.name}}</p> 

      </dl>
    </div>
  </div>
</script> 

我正在對Spotify API進行以下調用。 成功后，它將使用該JSON響應數據填充模板，然后將其放入占位符div中以向用戶顯示數據

        $.ajax({
            url: 'https://api.spotify.com/v1/me/player/recently-played',
            headers: {
              'Authorization': 'Bearer ' + access_token
            },
            success: function(response) {
              recentlyPlayedPlaceholder.innerHTML = recentlyPlayedTemplate(response);


              $('#login').hide();
              $('#loggedin').show();
            }
        });

因此，我試圖弄清楚該怎么做，是根據返回的軌道數來構建模板。

假設用戶一周沒有使用Spotify，然后聽了3首歌曲。 然后我要顯示3首歌曲。

如果他們聽了10，我想顯示10。

我只是不確定如何使模板動態。

我不需要簡單的答案，只要朝着正確的方向前進就可以了。

Answer 1

我認為您的代碼可以正常工作。 刪除<p>{{items.0.track.artists.0.name}} - {{items.0.track.name}}</p>並嘗試以下代碼。

  {{#each items}}
    <li>{{track.name}}</li>
  {{/each}}