AngularJS не отображает данные API

0

Я новичок в AngularJS. Я пытаюсь получить firstname, lastname & State из API, используя функцию поиска для кода состояния, например, "DC" для ex.

Я изменил, чтобы быть проще, и я все еще не вижу результата на странице:

Вот мой вопрос:

    function ItemsController($scope, $http){
    $http.get("https://my.ncarb.org/Public/api/certification/search?statecode=dc")
    .success(function(data, status, headers, config){
      $scope.items = data;
  });
}

Здесь образец моего api:

{
  "data": [
    {
      "id": "14e1047c-b811-40f7-8a21-780ae5edf1ed",
      "firstName": "Kent",
      "lastName": "Abraham",
      "city": "WASHINGTON",
      "stateCode": "DC",
      "countryCode": "USA"
    },]
}

и вот мой HTML:

  <body ng-controller="ItemsController">
    <h1>jSON Data</h1>
    <table>
      <tr ng-repeat="item in items">
        <td>{{item.id}}</td>
        <td>{{item.firstName}}</td>
        <td>{{item.stateCode}}</td>
      </tr>  
    </table>
  </body>

Но мой вывод, после проверки, получить статус 200 OK, но ничего не отображается на странице... Любая причина?

Прикрепленное изображение - Скриншот ответа в инструментах Dev

Изображение 174551

  • 1
    что означает эта строка $http.get($scope.state.statecode) .then(onStates); имел ввиду? это будет делать правильный вызов AJAX?
  • 0
    В методе get () я пытаюсь получить все коды состояний
Показать ещё 2 комментария
Теги:
asp.net-mvc-4

3 ответа

2
Лучший ответ

Ты делаешь это неправильно. $http.get возвращает обещание.

Вот рабочий образец.

HTML:

<div ng-app="app">
    <div ng-controller="ItemsController">
        <h1>jSON Data</h1>
        <table>
            <tr ng-repeat="item in items">
                <td>{{item.id}}</td>
                <td>{{item.firstName}}</td>
                <td>{{item.stateCode}}</td>
            </tr>
        </table>
    </div>
</div>

Угловое приложение и контроллер:

var module = angular.module('app', []);
angular.module('app').controller('ItemsController', ['$scope', '$http', function ($scope, $http) {
    $http.get('https://my.ncarb.org/Public/api/certification/search?statecode=dc').then(function (response) {
         // this callback will be called asynchronously
         // when the response is available
        $scope.items = response.data.data;
    }, function (response) {
          // called asynchronously if an error occurs
          // or server returns response with an error status.
    });
}]);

Вывод:

Изображение 174551

Поделиться
  • 0
    Спасибо @Bhushan Firake, я скопировал ваш javascript / controller, и он работает как шарм. Итак, для $ http.get () я всегда должен добавлять его с помощью .then ()?
  • 1
    @ Рон рад помочь. .then() касается .then() , я рекомендую вам прочитать docs.angularjs.org/api/ng/service/$q
Показать ещё 1 комментарий
1

данные являются полным ответом от api.

Просто делать:

$http.get("https://my.ncarb.org/Public/api/certification/search?statecode=dc")
    .success(function(data, status, headers, config){
    $scope.items = data.data;
});

Это решит вашу проблему :)

Поделиться
  • 0
    Спасибо @Mahaveer Jain, попробую
  • 0
    @ Рон рад помочь тебе. Вы можете попробовать. Тогда также :)
0

Почему вы делаете второй $ http.get()? Если первый возвращает образец api, это бесполезно, потому что вы должны передать что-то, возвращающее ответ в параметре вашего $ http.get()

Возможно, вы должны сделать $ scope.states = response.data сразу после вызова вашего API.

Поделиться
  • 0
    Нет, все тот же

Ещё вопросы

Сообщество Overcoder
Наверх
Меню