在AngularJS中使用$ http.get取回JSON時出現錯誤400

Question

當我嘗試從以下URL使用$ http.get檢索JSON時，出現錯誤400。

$http.get('https://api.spotify.com/v1/search?q=artist:Owl+City+title:On+The+Wing&type=track&limit=1'). 
    success(function(data) { 
    console.log("Success");   
    }) 
    .error(function(error, status, headers, config) { 
     console.log(status); 
     console.log("Error occured"); 
    }); 

我設法與該檢索：

$.getJSON('https://api.spotify.com/v1/search?q=artist:Owl+City+title:On+The+Wing&type=track&limit=1').then(function (data) { console.log("Success");}); 

但問題是，當我嘗試在我的$範圍更改值用這種方法，這只是顯示在視圖，之後的一個動作，因爲我得到了以前的歌曲信息而不是現在的歌曲。

這裏是控制器代碼：

angular.module('pwilApp') 
    .controller('SongsCtrl', function ($rootScope, $scope,$http,$sce) { 
    var increment = 0; 
    var laSimilaire = ""; 
    var init = true; 

    $rootScope.activeHome = ""; 
    $rootScope.activeSongs = "active"; 
    $rootScope.activeAccount = ""; 
    $rootScope.activeContacts = ""; 
    $rootScope.activeAbout = ""; 
    $rootScope.activeConnection = ""; 
    $scope.currentPage = 1; 
    $scope.totalPages = 0; 
    $scope.loading = true; 

    $scope.$on('$viewContentLoaded', function() { 
     $http.get('https://api.spotify.com/v1/search?q=artist:Owl+City+title:On+The+Wing&type=track&limit=1').success(function (data) { 
      console.log("Success");    
     }) 
     .error(function (error, status, headers, config) { 
      console.log(status); 
      console.log("Error occured"); 
     }); 

     $.getJSON('https://api.spotify.com/v1/search?q=artist:Owl+City+title:On+The+Wing&type=track&limit=1').then(function (data) { 
     $scope.preview_url = $sce.trustAsResourceUrl(data.tracks.items[0].preview_url); 
     }); 

    }); 

    } 

謝謝您的anwser。

Answer 1

工作完全正常，我

angular.module('pwilApp',[]) 
 
    .controller('SongsCtrl', function ($rootScope, $scope,$http) { 
 
    var increment = 0; 
 
    var laSimilaire = ""; 
 
    var init = true; 
 

 
    $rootScope.activeHome = ""; 
 
    $rootScope.activeSongs = "active"; 
 
    $rootScope.activeAccount = ""; 
 
    $rootScope.activeContacts = ""; 
 
    $rootScope.activeAbout = ""; 
 
    $rootScope.activeConnection = ""; 
 
    $scope.currentPage = 1; 
 
    $scope.totalPages = 0; 
 
    $scope.loading = true; 
 

 
     $http.get('https://api.spotify.com/v1/search?q=artist:Owl+City+title:On+The+Wing&type=track&limit=1').success(function (data) { 
 
      console.log("Success",data);  
 
$scope.songData = data.tracks.items;   
 
     }) 
 
     .error(function (error, status, headers, config) { 
 
      console.log(status); 
 
      console.log("Error occured"); 
 
     }); 
 

 
    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="pwilApp" ng-controller="SongsCtrl"> 
 

 
<div ng-repeat="song in songData"> 
 
{{song.id}} | {{song.name}} 
 
</div>