Как сделать AJAX-запрос от помощника руля? - PullRequest
Новая
       3

Как сделать AJAX-запрос от помощника руля?

0 голосов
/ 17 марта 2019

Я пытаюсь создать HTML-таблицу из плейлистов пользователя Spotify и всех треков в этих плейлистах.Я могу получить список воспроизведения просто отлично. Однако, чтобы получить треки в этом списке воспроизведения, мне нужно сделать еще один запрос.В настоящее время я использую помощник (get_track), чтобы сделать второй запрос, и вызываю его, когда я перебираю каждый список воспроизведения.Однако это не совсем работает .. Все возвращается неопределенным.Есть лучший способ сделать это?

Когда я консоль регистрирую response.items из запроса в помощнике, я получаю именно те данные, которые мне нужны, я просто не понимаю, как вставить это в мой шаблон ...? 

<script id="playlist-template" type="text/x-handlebars-template">
  <h1>playlists</h1>
  <table>
    <tr>
      <th>playlist</th>
      <th>tracks</th>
    </tr>
    {{#playlists.items}}
      <tr>
        <td><a href="{{external_urls.spotify}}">{{name}}</a></td>
        <td>
            <table>
              <tr>
                <th>track name</th>
              </tr>
              {{log (get_track tracks.href)}}
              {{#each (get_track tracks.href)}}
                <tr>
                  <td>{{track.name}}</td>
                </tr>
              {{/each}}
            </table>
        </td>
      </tr>
    {{/playlists.items}}
  </table>
</script>




var playlistSource = document.getElementById('playlist-template').innerHTML,
playlistTemplate = Handlebars.compile(playlistSource),
playlistPlaceholder = document.getElementById('playlist');

    Handlebars.registerHelper('get_track', function(tracks){
      return $.ajax({
        url: tracks,
        headers: {
          'Authorization': 'Bearer ' + access_token
        },
        success: function(response) {
          return response.items;
        }
      });
    });
      if (access_token) {
        // render oauth info
        oauthPlaceholder.innerHTML = oauthTemplate({
          access_token: access_token,
          refresh_token: refresh_token
        });

        $.ajax({
            url: 'https://api.spotify.com/v1/me',
            headers: {
              'Authorization': 'Bearer ' + access_token
            },
            success: function(response) {
              userProfilePlaceholder.innerHTML = userProfileTemplate(response);

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

        $.ajax({
            url: 'https://api.spotify.com/v1/me/playlists',
            headers: {
              'Authorization': 'Bearer ' + access_token
            },
            success: function(response) {
              playlistPlaceholder.innerHTML = playlistTemplate({Playlists: response}); //get playlists
              console.log(response);
              $('#login').hide();
              $('#loggedin').show();
            }
        });
      }

1 Ответ

0 голосов
/ 18 марта 2019

Если вы хотите отобразить {{track.name}} из вашего запроса ajax, вы не можете этого сделать.Track.name должен быть определен в ваших исходных данных, если вы хотите, чтобы он был определен.Вы не можете изменить данные, которые передаются на руль.Однако, что вы можете сделать, это вернуть значение вашего трека в вашем помощнике, и тогда оно будет отображаться в вашем шаблоне.Последнее сомнение, которое у меня есть, касается синхронизации: вам нужно синхронизировать ваш запрос, чтобы получить возвращаемое значение в вашем помощнике, иначе он будет нулевым: ajax является асинхронным, поэтому вы должны подождать конец запроса ajax с некоторым временемцикл, чтобы вернуть значение для вашего помощника.

Я надеюсь, что я достаточно ясно, иначе я постараюсь быть более точным.

...