2014-06-15 7 views
6

Obecnie pracuje nad aplikacją telewizyjną JS Angular. Aplikacja pobiera dane z połączenia api. Próbuję uzyskać obrazy z tablicy wyników.AngularJS GET 404 nie znaleziono

Oto kod dla mainController.js

app.controller("mainController", function($scope, $http){ 
    $scope.apiKey = "b3e2e6f87d3aeec3075668a1bd4a78e2"; 
    $scope.init = function(){ 
     //api call requires format, apiKey, date, and days 
     var today = new Date(); 
     //format apiDate according to the api specifications 
     var apiDate = today.getFullYear() + ("0" + (today.getMonth()+1)) + today.getDate(); 
     $scope.results = []; 
     console.log(apiDate); 
     $http.jsonp('http://api.trakt.tv/calendar/premieres.json/' + $scope.apiKey + '/' + apiDate + '/' + 30 + '/?callback=JSON_CALLBACK').success(function (data){ 
      //connection successful 
      //console.log(data); 
      angular.forEach(data, function (value, index){ 
       var date = value.date;//stores the date of the tv shows 
       angular.forEach(value.episodes, function (tvshow, index){ 
        //this adds the locally store date to the tvshow object 
        tvshow.date = date; 
        $scope.results.push(tvshow); 
       });//end 2nd for each 
      });//end 1st for each 
     }).error(function (error){ 
      //connection failed 
     }); 
    }; 
}); 

Oto kod dla index.html

<ul class="episode-list"> 
     <li ng-repeat="tvshow in results"> 
      <div class="row-fluid"> 
      <div class="span3"> 
       <img src="{{tvshow.episode.images.screen}}"/> 
      </div> 
     </div> 
     </li> 
    </ul> 

Konsola zwraca następujące błędy:

GET: // localhost /tvApp/%7B%7Btvshow.episode.images.screen%7D%7D 404 (nie znaleziono) localhost /: 29

GET //localhost/tvApp/%7B%7Btvshow.episode.images.screen%7D%7D 404 (Not Found) angular.min.js: 20

Nie jestem pewien, dlaczego tak się dzieje. Każda pomoc będzie doceniona. Rozglądałem się za podobnym problemem, ale bez powodzenia

+0

Nie ma nic złego w tym kodzie, może twój link do uzyskania $ http nie jest poprawny logicznie, cały twój kod jest poprawny – Milad

Odpowiedz

14

Zastosowanie ng-src zamiast src:

<img ng-src="{{tvshow.episode.images.screen}}"> 

Zapobiega to obraz z załadunkiem przed kątowego znaczników jest przetwarzany przez angularjs. Przy użyciu adresu src zostanie załadowany literalny URL http://www.mydomain.com/{{tvshow.episode.images.screen}}.

+0

Dziękujemy! To działa. –

+0

Świetne rozwiązanie. –

0

Sprawdź, czy wywołanie zwrotne sukcesu rzeczywiście wyzwala.

Sprawdź, czy program telewizyjny zawiera odcinki zawierające obrazy, które zawierają ekran. Brak błędów pisowni?

+0

Odwołanie do powodzenia jest wyzwalane, ponieważ tablica $ scope.results jest wypełniona. Czy chcesz zobaczyć jakikolwiek inny kod? Postępuję zgodnie z tym przykładem: http://code.tutsplus.com/tutorials/building-a-web-app-from-scratch-in-angularjs--net-32944 –