Ionic: HTTP get isn't working?

Question

My HTTP get isn't loading the data and i'm not sure why. Please could someone help me? I've tried two web hosting, ones mine and i get a 'No 'Access-Control-Allow-Origin' header is present on the requested resource.' error so i used the Myjson servers and now i don't get any errors but nothing loads, please could someone help?

Here's my json file:

{
  "response1": [
    {
      "announcement_name": "Example Message 1"
    },
    {
      "date": "15/05/2015"
    },
    {
      "message": "Example Message 1"
    }
  ],
  "response2": [
    {
      "announcement_name": "Example Message 2"
    },
    {
      "date": "15/05/2015"
    },
    {
      "message": "Example Message 2"
    }
  ]
}

HTML:

 <body ng-app="Announcement">
    <ion-view view-title="Announcements">
      <ion-pane>
         <ion-header-bar class="bar-positive">
          <h1 class="title">Pull To Refresh</h1>
        </ion-header-bar>
        <ion-view view-title="Announcements">
        <ion-content ng-controller="Controller">
          <ion-refresher on-refresh="doRefresh()">

          </ion-refresher>
          <ion-list>
            <ion-item ng-repeat="item in items" ng-click="getData()">

            <div class="list card">
              <div class="item item-divider">{{announcement_name}} - {{date}}</div>
              <div class="item item-body">
                <div>
                  {{message}}
                </div>
            </ion-item>
          </ion-list>
        </ion-content>
        </ion-view>

Javascript:

.controller('Controller', function($scope, $http) {
    $scope.items = [1,2,3];
    $scope.doRefresh = function() {
        $http.get("https://api.myjson.com/bins/1sdnx")
            .success(function(data) {
                $scope.announcement_name = data.announcement_name;
                $scope.date = data.date;
                $scope.message = data.message;
            })
            .finally(function() {
           // Stop the ion-refresher from spinning
           $scope.$broadcast('scroll.refreshComplete');
         });
      };
    });

Is your application connecting to the internet? You might have to whitelist the domains for Cordova Android 4.0 and above. In that case, this will help you: http://stackoverflow.com/a/29916802/4412363 — Keval, May 18 '15 at 15:46

score 0 · Answer 1 · answered May 19 '15 at 04:08

The actual response data, is present on the data object of the response.

.controller('Controller', function($scope, $http) {
    $scope.items = [1,2,3];
    $scope.doRefresh = function() {
        $http.get("https://api.myjson.com/bins/1sdnx")
            .success(function(result) {
                console.log(result);
                console.log(result.data);
                $scope.announcement_name = result.data.announcement_name;
                $scope.date = result.data.date;
                $scope.message = result.data.message;
            })
            .finally(function() {
           // Stop the ion-refresher from spinning
           $scope.$broadcast('scroll.refreshComplete');
         });
      };
    });

Ionic: HTTP get isn't working?

1 Answers1