I do not get the data from $ http GET in Angular

0

It does not show the page when trying to perform the GET. I have the following code:

app.js

(function(){
    var app= angular.module('starter', ['ionic'])

app.controller('NotiCtrl',function($scope,$http){
    $scope.posts=[];
    $http.get('http://www.notilogia.com/wp-json')
      .success(function(data){
        console.log(data.data.children);
        $scope.posts=data.data.children;

      });
      

  });
    
    
app.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    if(window.cordova && window.cordova.plugins.Keyboard) {

      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);

      cordova.plugins.Keyboard.disableScroll(true);
    }
    if(window.StatusBar) {
      StatusBar.styleDefault();
    }
  });
})
} ());

In index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <script src="cordova.js"></script>

    <script src="js/app.js"></script>
  </head>
  <body ng-app="starter" ng-controller="NotiCtrl">

    <ion-pane>
      <ion-header-bar class="bar-stable">
        <h1 class="title">Notilogia</h1>
      </ion-header-bar>
      <ion-content>
      <div class="list">
          
          <a class="item item-thumbnail-left" ng-repeat="post in posts" href="{{post.data.url}}">
        <img ng-src="{{post.data.thumbnail}}"ng-if="post.data.thumbnail.indexOf('http')===0">
          <h2 class="post-title">{{post.data.title}}</h2>
          <p>{{post.data.domain}}</p>
        </a>
      </div>
      </ion-content>
    </ion-pane>
  </body>
</html>
    
asked by Juan Motta 17.07.2016 в 17:59
source

1 answer

0

The problem is that the GET response of the service you are calling is malformed and can not be parsed by angularjs to JSON.
Doing a bit of debugging I noticed that the answer comes in the following way:

<script>
        var url = "http://www.notilogia.com/";

    </script>
    {"name":"Notilog\u00eda","description":"Te ofrece m\u00e1s que noticias.","url":"http:\/\/www.notilogia.com","home":"http:\/\/www.notilogia.com","namespaces":["oembed\/1.0","wp\/v2"],"authentication":[],"routes":{...}

Note: Service response is cut due to response restriction in SO

My only recommendation would be to transform the response and remove some of the characters that do not comply with the JSON format.
EYE: As long as you are sure that only these characters are the ones that are left over strong>
For example:

$http.get('http://www.notilogia.com/wp-json', {
            transformResponse: function (data) {
                return JSON.parse(data.replace('<script>', '').replace('var url = "http://www.notilogia.com/";', '').replace("<\script>", ''));
            }
        }).then(function (response) {
                console.log(response.data);
                $scope.posts = response.data;
        });

I also noticed that you expect data.childrens . This element does not exist in the answer, so I recommend that you examine it to choose the data you want to show in $ scope.posts

    
answered by 23.03.2017 в 18:49