2016-10-06 2 views
0

Я пытаюсь получить данные из веб-API и отображать их в таблице, но это не сработает. Я новичок в angularjs и программирую простую программу для получения данных из веб-API и отображения в таблице. Но я не могу получить данные.Извлечение данных JSON из API с помощью AngularJS

Модуль

var app = angular.module("myApp", []); 

Сервис

app.service("myService", function ($http) { 
     //get All Eployee 
     this.getEmployees = function() { 
      return $http.get('http://apidemo.gouptechnologies.com/api/admin'); 
     }; 
    }) 

Контроллер

app.controller("myCntrl", function ($scope, myService) { 
     $scope.divEmployee = false; 
     GetAllEmployee(); 
     function GetAllEmployee() { 
      alert('home'); 
      var getData = myService.getEmployees(); 
      getData.then(function (emp) { 
       $scope.employees = emp.data; 
      }, function() { 
       alert('Error in getting records'); 
      }); 
     } 
    }); 

код JS включен в главный тег HTML-файла.

HTML тело

<body> 
    <div ng-app="myApp" ng-controller="myCntrl"> 
     <ul> 
      <li ng-repeat="x in employees"> 
       {{ x.username + ', ' + x.password }} 
      </li> 
     </ul> 
    </div> 
</body> 

API URL является законным. Спасибо.

+0

вы получаете предупредительное сообщение –

+0

Да я получаю предупредительное сообщение для «Ошибка при получении записи»; –

+0

Тогда запрос HTTP, похоже, терпит неудачу. Вы должны посмотреть на полученную вами ошибку и вкладку сети в devtools вашего браузера. Мы не можем вам помочь, если мы не знаем, что такое ошибка. –

ответ

0

Пусть Пример JSON файл в «данные/branchList.json» каталог, и я пытаюсь получить доступ все данные из файла JSON с помощью $http. Это может помочь вам также позвонить в службу отдыха. проверить этот пример

данные/branchList.json

[ 
    { 
    "branch_id": 1, 
    "branch_name": "Mummbai", 
    "branch_address": "India" 
    }, 
    { 
    "branch_id": 2, 
    "branch_name": "New York", 
    "branch_address": "US" 
    } 
] 

Контроллер

angular.module('myApp') 
    .controller('myCntrl', ['$http', '$state', function ($http, $state) { 

     'use strict'; 

     var vm = this; 

     function init(){ 

      vm.branchs = ''; 

      loadBranch(); 
     } 
     init(); 

     function loadBranch(){ 
      $http.get('data/branchList.json').success(function(response){ 

       vm.branchs = response; 
      }) 
     } 
    }]); 

В этом примере я храню все данные в vm.branches переменной, вы можете используйте эту переменную в html страница

HTML

<li class="col-sm-6" ng-repeat = "branch in vm.branchs"> 

    <strong>{{branch.branch_name}}</strong> 

    <span>{{branch.branch_address}}</span> 
</li>