Угловой вид пустой объект, возвращающий запрос $ http.get

Question

Я получаю объект данных из API через $ http.get(). Это мой угловой регулятор:

angular.module('supernovaWebApp',['ui.router']) 
 
    .controller('professoresCtrl', ['$scope', '$http', function($scope, $http){ 
 
     $http.get("http://localhost:3000/api/instructors/"+instructorId).success(function(data,status){ 
 
      console.log(data); 
 
      $scope.professor = data;   
 
     }); 
 
     }; 
 
    }]) 
 
    .config(function($stateProvider){ 
 
    $stateProvider.state('instructor', { 
 
     url: '/instructor', 
 
     templateUrl: 'views/instructor.html', 
 
     controller: 'professoresCtrl' 
 
    }); 
 
    });

Объект возвращается без ошибок и можно увидеть в консоли WebBrowser, но нет данных показывается в представлении.

<div> 
 
    <div class="mdl-cell mdl-cell--4-col"> 
 
    <div class="mdl-card mdl-shadow--2dp"> 
 
     <div class="mdl-card__title"> 
 
     <h2 class="mdl-card__title-text">{{professor.name}} {{professor.last_name}}</h2> 
 
     </div> 
 
     <div class="mdl-card__supporting-text"> 
 
     <p>{{professor.profession}}</p> 
 
     <i class="material-icons md-18">phone</i> {{professor.phone}} 
 
     </div> 
 
     <div class="mdl-card__menu"> 
 
     <button ng-click="delInstructor(instructor)" class="mdl-button mdl-button--icon mdl-js-button mdl-js-ripple-effect" > 
 
      <i id="btn-archive" class="material-icons" >clear</i> 
 
      <span class="mdl-tooltip" data-mdl-for="btn-archive"> 
 
      Arquivar 
 
      </span> 
 
     </button> 
 
     </div> 
 
    </div> 
 
    </div>   
 
</div>

bizare Дело в том, что этот код работает, когда я получаю массив объектов и использования нг-повтора, чтобы показать потом. Я ищу некоторые проблемы, но не могу найти решение. Что мне не хватает? Не могли ли вы помочь мне, пожалуйста. Я застрял.

Печать консоли. Объект, который отображается правильно, это тот, у которого есть id: 1. Console print enter image description here

Когда я делаю то же самое, чтобы получить больше, чем один объект из базы данных, он работает. Вот аналогичный код.

angular.module('supernovaWebApp',['ui.router']) 
 
    .controller('professoresCtrl', ['$scope', '$http', function($scope, $http){ 
 
     
 
     var getInstructors = function(){ 
 
     $http.get("http://localhost:3000/api/instructors").success(function(data,status){ 
 
      console.log(data); 
 
      $scope.instructors = data; 
 
     }); 
 
     }; 
 
    getInstructors(); 
 
    }]) 
 
    .config(function($stateProvider){ 
 
    $stateProvider.state('instructors',{ 
 
     url: '/instructors', 
 
     templateUrl: 'views/instructors.html', 
 
     controller: 'professoresCtrl' 
 
    }); 
 
    });

<div ng-repeat="instructor in instructors"> 
 
    <div class="mdl-cell mdl-cell--4-col"> 
 
    <div class="mdl-card mdl-shadow--2dp"> 
 
     <div class="mdl-card__title"> 
 
     <h2 class="mdl-card__title-text">{{instructor.name}} {{instructor.last_name}}</h2> 
 
     </div> 
 
     <div class="mdl-card__supporting-text"> 
 
     <p>{{instructor.profession}}</p> 
 
     <i class="material-icons md-18">phone</i> {{instructor.phone}} 
 
     </div> 
 
     <div class="mdl-card__actions mdl-card--border"> 
 
     <a ui-sref="instructor" ui-sref-active="active" ng-click="getInstructor(instructor.id)" class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect"> 
 
      Veja mais! 
 
     </a> 
 
     </div> 
 
     <div class="mdl-card__menu"> 
 
     <button ng-click="delInstructor(instructor)" class="mdl-button mdl-button--icon mdl-js-button mdl-js-ripple-effect" > 
 
      <i id="btn-archive" class="material-icons" >clear</i> 
 
      <span class="mdl-tooltip" data-mdl-for="btn-archive"> 
 
      Arquivar 
 
      </span> 
 
     </button> 
 
     </div> 
 
    </div> 
 
    </div>   
 
</div>

Answer 1

Обновлено после Fissio прокомментировал

Остаточная $http.get(..).success() имеет другую подпись, чем новее $http.get(..).then(...), который работает с обещаниями. Так $scope.professor = data старый способ $scope.professor = data.data

Старый Ответ

$ HTTP возвращает объект ответа. Ваши фактические данные находятся в «response.data». Таким образом, вы используете $scope.professor = data;, где должно быть $scope.professor = data.data. Хотя это не объясняет правильное поведение на массивах.