Как использовать angular нг-повтор с веб-API? - PullRequest
Новая
       7

Как использовать angular нг-повтор с веб-API?

1 голос
/ 27 января 2020

Я пытаюсь создать сайт, используя интерфейс html и получать его данные из Web-API. Мой Web-API возвращает формат json. Поэтому я пытался использовать запрос Get, используя директиву Angular $ http и ng-repeat. Мой angular контроллер выглядит так - 

'use strict';  app.controller('blogsController', ['$scope','$http', function ($scope, $http) {
$http.get('www.example.com/api/blog')
   .then(function(res){
      $scope.blogs = res.data;
    });
}]);

Код html выглядит следующим образом - 

<body app="ng-app" >
   <div ng-repeat="xr in blogs" >
     <div id="blog_title" >
       {{xr.blog_title}}
     </div>

     <div id="blog_text">
       {{xr.blog_text}}
     </div>
   </div>

</body>

Я пробовал это, но я не получаю данные от блог веб-API.

Пожалуйста, помогите мне получить решение .....

Ответы [ 2 ]

1 голос
/ 27 января 2020

в вашем коде нет ничего плохого 

<div ng-repeat="xr in blogs" >
     <div id="blog_title" >
       {{xr.blog_title}}
     </div>

     <div id="blog_text">
       {{xr.blog_text}}
     </div>
   </div>

, но убедитесь, что ваш res.data должен следовать следующим правилам: 

res.data = [{'blog_title': 'title value1', 'blog_text':'text value'}
            {'blog_title': 'title value2', 'blog_text':'text value'}
            {'blog_title': 'title value3', 'blog_text':'text value'}]

распечатайте res.data в Интернете консоль, используя console.log для подтверждения.

0 голосов
/ 27 января 2020

В шаблоне отсутствует ng-контроллер, и app должно быть ng-app

<body ng-app="ng-app" ng-controller="blogsController">
   <div ng-repeat="xr in blogs" >
     <div id="blog_title" >
       {{xr.blog_title}}
     </div>

     <div id="blog_text">
       {{xr.blog_text}}
     </div>
   </div>

</body>
...