2013-07-30 6 views
5

Tôi mới tham gia AngularJs và vẫn đang cố gắng tìm ra cách cơ bản hoạt động ... Tôi đang sử dụng API Soundcloud để lấy danh sách người theo dõi cho một người dùng cụ thể. Cho đến nay trong hàm $scope.init của tôi, tôi có thể kết nối với Soundcloud, xác thực người dùng và trả về một danh sách json của những người theo dõi của người dùng. Sau đó tôi đẩy mỗi người theo dõi vào một mảng gọi là $scope.results và xác minh rằng mảng đã đầy bằng cách xuất nó trong bảng điều khiển. Tuy nhiên khi tôi cố gắng ra từng đi theo như một mục danh sách trong mảng sử dụng ng-repeat trong main.html quan điểm của tôi và tôi nhận được gì ..... đây là mã của tôi:AngularJS ng-repeat không hoạt động?

main.js

.controller('MainCtrl', function ($scope, $http) { 
    $scope.apiKey = "##########################"; 
    $scope.results = []; 
    $scope.init = function(){ 
    SC.initialize({ 
     client_id: $scope.apiKey, 
     redirect_uri: "http://localhost:9000/callback.html" 
    }); 
    // initiate auth popup 
    SC.connect(function() { 
     SC.get('/me', function(me) { 
     alert('Hello, ' + me.username); 
    }); 

    SC.get('/me/followers', function(followers) { 
     //console.log(followers); 
     //angular.forEach(followers, function(value, index){ 
      angular.forEach(followers, function(follower, index){ 
       $scope.results.push(follower); 
      }); 
      console.log($scope.results); 
    }); 
}); 

main.html // đó là một cái nhìn

`<div ng-init="init()">` 
`<li ng-repeat="follower in results">` 
`<div class="row-fluid">` 
    `<div class="span3">` 
     `<div class="span6">` 
     <h3>{{follower.username}}</h3> 
     <p>{{follower.description}}</p> 
    </div> 
</div> 
</div> 
</li> 
</div> 

index.html

<!doctype html> 
<!--[if lt IE 7]>  <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> 
<!--[if IE 7]>   <html class="no-js lt-ie9 lt-ie8"> <![endif]--> 
<!--[if IE 8]>   <html class="no-js lt-ie9"> <![endif]--> 
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]--> 
<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<title></title> 
<meta name="description" content=""> 
<meta name="viewport" content="width=device-width"> 
<!-- Place favicon.ico and apple-touch-icon.png in the root directory --> 
<!-- build:css styles/main.css --> 
<link rel="stylesheet" href="styles/bootstrap.css"> 
<link rel="stylesheet" href="styles/main.css"> 
<!-- endbuild --> 
    </head> 
    <body ng-app="soundSelectApp" ng-controller="MainCtrl"> 
    <!--[if lt IE 7]> 
     <p class="chromeframe">You are using an outdated browser. <a href="http://browsehappy.com/">Upgrade your browser today</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to better experience this site.</p> 
<![endif]--> 

<!--[if lt IE 9]> 
    <script src="components/es5-shim/es5-shim.js"></script> 
    <script src="components/json3/lib/json3.min.js"></script> 
<![endif]--> 

<!-- Add your site or application content here --> 
<div class="container" ng-view></div> 

<script src="components/angular/angular.js"></script> 
<script src="components/angular-resource/angular-resource.js"></script> 
<script src="components/angular-cookies/angular-cookies.js"></script> 
<script src="components/angular-sanitize/angular-sanitize.js"></script> 

<!-- build:js scripts/scripts.js --> 
<script src="scripts/app.js"></script> 
<script src="scripts/controllers/main.js"></script> 
<script src="http://connect.soundcloud.com/sdk.js"></script> 
<!-- endbuild --> 

<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. --> 
<script> 
    var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']]; 
    (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0]; 
    g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js'; 
    s.parentNode.insertBefore(g,s)}(document,'script')); 
</script> 

Trả lời

12

Bạn đang thiếu một cuộc gọi đến $ apply() bởi vì bạn đang làm việc bên ngoài của thế giới góc vì vậy hãy thử để thêm một dòng dưới đây lệnh push và nó cũng làm việc

angular.forEach(followers, function(follower, index){ 
       $scope.results.push(follower); 
      }); 

$scope.$apply() 
+0

tuyệt vời cảm ơn bạn! – accraze