$ http.get метод в angularjs для отдыха Api

Я хочу получить список друзей для REST-API в таблицу, используя метод $ http.get в angularjs. См. DEMO. Я не могу загрузить данные JSON, когда я нажимаю кнопку.

JSON.data

{ 
    "friends": [ 
     { 
      "FirstName": "John", 
      "LastName": "Doe" 
     }, 
     { 
      "FirstName": "Ann", 
      "LastName": "Wellington" 
     }, 
     { 
      "FirstName": "Sabrina", 
      "LastName": "Burke" 
     } 
    ] 
}

Index.html

<body ng-app="step4App"> 
     <div ng-controller="FriendsCtrl"> 
      <button ng-click="loadFriends()">Load Friends</button> 
      <table> 
        <thead> 
        <tr><th>First</th><th>Last</th></tr> 
        </thead> 
        <tbody> 
        <tr ng-repeat="friend in friends"> 
          <td>{{friend.FirstName}}</td> 
          <td>{{friend.LastName}}</td> 
        </tr> 
        </tbody> 
      </table> 

     </div> 
     <script> 
      var app=angular.module("step4App",[]); 
      app.controller("FriendsCtrl", function($scope, $http){ 
       $scope.loadFriends=function(){ 
        $http.get("friendsList.json").success(function(data){ 
          $scope.friends=data; 
        }).error(function(){ 
          alert("An unexpected error occured!"); 
        }); 
       } 
      }); 
     </script> 
    </body>

источник

2015-07-07 geeks

вы служите это от Apache? Или локальная файловая система? Если вы используете Chrome, локальная файловая система, вероятно, не сработает для вас. –

Ваш файл в формате JSON есть объект, и $scope.friends является массивом.

Вам нужно изменить:

$scope.friends=data;

к:

$scope.friends = data.friends;

DEMO

источник

2015-07-07 10:51:11 Niezborala

Спасибо за ответ. Его работа, я всегда смущаюсь, когда ситуация такого типа прибывает, не могли бы вы объяснить больше об этом ....... – geeks

Что значит «больше»? – Niezborala

$ http.get метод в angularjs для отдыха Api

ответ

Смежные вопросы