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 个。

我只是不确定如何使模板动态化。

我不需要直截了当的答案，只需按一下右边的按钮即可 direction.any 欢迎帮助。

Answer 1

我假设您的代码没有任何错误。删除 <p>{{items.0.track.artists.0.name}} - {{items.0.track.name}}</p> 并尝试下面的代码。

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

Handlebars.js 是否允许动态模板？

Does Handlebars.js allow for dynamic templates?

javascript

handlebars.js

spotify-desktop