麻烦在angularJs

Question

我想读一下包含的歌曲列表和URL的图像

{"songs" : [ 
{ 
    "SongName" : "Broken Dreams", 
    "image" : "img/browser.svg" 
}, 
{ 
    "SongName" : "My heart goes on", 
    "image" : "img/browser.svg" 
}, 
{ 
    "SongName" : "Summer of 69", 
    "image" : "img/browser.svg" 
}, 
{ 
    "SongName" : "Broken Hearted Girl", 
    "image" : "img/browser.svg" 
}, 
{ 
    "SongName" : "American idiot", 
     "image" : "img/browser.svg" 
    } 
]} 

但基本的问题是，当我使用$ http.get一个JSON文件中读取JSON数据（），它读取JSON，但我不能把它分配给了angularJS对象，这里是我的angularJS代码

var app = angular.module('TheSlideShow', []); 
     app.controller('mainController', ['$scope', '$http', function($scope, $http){ 

      $scope.test = "this is a test string"; 
      $scope.songList = {}; 

       $http.get("Data/SongList.json", ['$scope']).success(function(List){ $scope.songList = List.songs; console.log("The Length : " + $scope.songList.length);}); 

      for(var i = 0; i< $scope.length; i++) 
       { 
        console.log("loop number" + i); 
       } 

     }]); 

长度字段给出结果为5，但我的for循环不会为一个连运行单次..

Answer 1

N错误的赭

1. 你不应该传递$scope到$http.get
2. 你不能得到外界的AJAX directictly，价值是越来越通过Ajax调用填充$scope.songList值，所以你需要AJAX的成功在for循环中运行

代码

$http.get("Data/SongList.json").success(function(List){ 
    $scope.songList = List.songs; 
    console.log("The Length : " + $scope.songList.length); 
    for(var i = 0; i< $scope.songList.length; i++) 
    { 
    console.log("loop number" + i); 
    } 
});