0

I have two $http.get calls that need to happen.

The first call gets basic information about a tv show.

The second call is dependent on the first call, as it gets information about that same TV show's episodes.

My problem is that I need 'remember' the ID of the TV show when getting a response from the second HTTP GET (the data that's returned from the second HTTP GET doesn't contain an ID for the original HTTP GET call).

Here's the solution that I've come up with, but it seems a bit "hacky" to me. I'm grabbing the HTTP Header of the second call (as it contains my ID):

(function () {
  angular.module("ngTvShows")
       .controller("myTvShowsController", function ($http, tvShowFactory, nextEpisodeService, tvShowInfoService) {
          var vm = this;
         
          vm.currentNavItem = "myTvShowsNav";
          vm.myTvShows = tvShowFactory.myTvShows;

          for (var i=0; i<vm.myTvShows.length; i++)
          {
            tvShowInfoService.getTvShowInfo(vm.myTvShows[i].id).then(function (results){
              for (var j=0; j<vm.myTvShows.length; j++)
              {
                if (vm.myTvShows[j].id == results.data.id)
                {
                  vm.myTvShows[j].tvShowInfo = results.data;
                  return nextEpisodeService.episodes(vm.myTvShows[j].id, vm.myTvShows[j].tvShowInfo.number_of_seasons);
                }
              }
            }).then(function (results) {
              // here's where I get the TV show's ID from the header
              var tvId = results.config.url.split("api.themoviedb.org/3/tv/")[1].split("/")[0];
              var index = getTvShowIndex(tvId);
              var today = new Date();
              for (episode of results.data.episodes)
              {
                if (today < new Date(episode.air_date))
                {
                  vm.myTvShows[index].tvShowInfo.nextEpisode = episode.air_date;
                  break;
                }
              }

            });
          }

          function getTvShowIndex (tvId)
          {
            for (var i=0; i<vm.myTvShows.length; i++)
            {
              if (tvId == vm.myTvShows[i].id)
              {
                return i;
              }
            }
            return -1;
          }
       });
})();

I'm new to Angular JS, so I'm sure there's a more elegant solution for this... I'm open to suggestions :)

Trevor
  • 1,137
  • 1
  • 19
  • 33
  • I don't understand. First you claim that "*the data that's returned from the second HTTP GET doesn't contain the ID*", but then you "*get the TV show's ID from the header*"? – Bergi Nov 28 '16 at 22:42
  • Your code that does `return` from the middle of a loop is pretty unreadable. You should use more helper functions like `getTvShowIndex` that find something in the data. – Bergi Nov 28 '16 at 22:43
  • Check out the duplicate. Basically you seem to want to access the `results.data.id` from the first request, right? – Bergi Nov 28 '16 at 22:45
  • This is a simple matter of exploiting closure, which will happen naturally if you loop through `vm.myTvShows` with `.forEach()` or `.map()` instead of `for(...){...}`, trapping formal variable `show`, from which `show.id` can be read as many times as you like, at any depth, within .forEach()'s or .map()'s callback function. – Roamer-1888 Nov 29 '16 at 12:22

0 Answers0