2017-03-10 2 views
0

저는이 기능이 새로 도입되었으며 임시 연락처 목록을 만들려고합니다. mongodb에서 데이터를 가져 오는 로그를 인쇄했으며 브라우저 콘솔에서 올바른 데이터를 볼 수 있지만 HTML 파일로 인쇄하려고 시도하면 표시되지 않습니다. 내가이 데이터를 인쇄하려고controller.js가 가져온 데이터를 인쇄 할 수 없습니다.

controller.js

var myApp = angular.module('myApp', []); 
myApp.controller('AppCtrl', ['$scope', '$http', function($scope, $http){ 
$http.get('/contactlist').then(function(response){ 
console.log("I got the response"); 
console.log(response); //able to see correct data is fetched in the browser console 
$scope.contactlist=response; 
}); 
}]) 

표 :

<tbody> 
    <tr ng-repeat="Contact in contactlist"> 
     <td>{{Contact.name}}</td> 
     <td>{{Contact.email}}</td> 
     <td>{{Contact.number}}</td> 
    </tr> 
</tbody> 

잘못 무슨 일인지 설명해주십시오

다음은 조각이다. 콘솔에 표시

응답 : enter image description here

+0

콘솔에 오류가 있습니까? – Ashot

+0

가 목록에 오시겠습니까? 응답을 붙여 넣을 수 있습니까? – Monicka

+0

콘솔에 오류가 표시되지 않습니다. – codefreak

답변

1

자바 스크립트는 항상 동기입니다. 여기서 일어나는 일은 $scope.contactlist=response;$http.get('/contactlist')... 완료 전에 실행 중입니다. 즉, $scope.contactlist은 정의되지 않았습니다. 이 문제를 해결하려면 Service을 사용하는 것이 좋습니다.

var myApp = angular.module('myApp', []); 
myApp.controller('AppCtrl', ['$scope', 'dataService', function($scope, dataService){ 

    dataService.contactLists(function(response) { 
    console.log(response.data); 
    $scope.contactlist=response.data; 
    }); 

}); 
}]) 

myApp.service('dataService', function($http) { 
    this.contactLists = function(callback){ 
    $http.get('/contactlist').then(callback) 
    } 
});