WooCommerce RestAPI

Trying a json GET request and having trouble posting from a RestAPI.
shop.html

<ion-view title="Shop">
<ion-content>
<ion-refresher on-refresh="doRefresh()">
                 
</ion-refresher>
<div class="button-bar bar-energized">
<a class="button">Birds</a>
<a class="button">Cats</a>
<a class="button">Dogs</a>
</div>

<div class="list">

<a class="item item-thumbnail-left" href="#">
<img src="{{img}}">
<h2>{{h2}}</h2>
  <p>{{subtitle}}</p>
</a>


</div>
</ion-content>
</ion-view>

shop-detail.html

<ion-view title="{{productName}}">
<ion-content has-header="true" padding="true">
</ion-content>
</ion-view>

services.js

angular.module('starter.services', [])

/**
* A simple example service that returns some data.
*/
.factory('Shop', function() {
// Might use a resource here that returns a JSON array

// Some fake testing data
var apiURL = 'http://www.verizonwireless.com/deals-landing/apple+htc+lg+motorola+samsung+verizon/all-deals/',
config = {timeout: 10000};

function validateResponse(result){
return !(typeof result.data != 'array' && typeof result.data != 'object');
}

return{
// enter a request's reponse in to the cache
search: function(query){
var q = $q.defer();
$http.get(apiURL+query, config)
.then(function(result){
return !validateResponse(result)? q.reject(new Error('Invalid Response')):q.resolve(result.data);
},function(err){
console.log('Query '+page+' Failed');
q.reject(err);
});
return q.promise;
}
}
});
and the controllers.js
angular.module('starter.controllers', [])

.controller('IntroCtrl', function($scope, $state, $ionicSlideBoxDelegate) {
$scope.startApp = function() {
$state.go('tab.dash');
window.localStorage.didTutorial = true;
};
$scope.next = function() {
$ionicSlideBoxDelegate.next();
};
$scope.previous = function() {
$ionicSlideBoxDelegate.previous();
};
$scope.slideChanged = function(index) {
$scope.slideIndex = index;
 };
})

.controller('DashCtrl', function($scope) {
})

.controller('ShopCtrl', function($scope,$state, $http, $templateCache, Shop) {
 $scope.doRefresh = function() {
    
    console.log('Refreshing!');
    $timeout( function() {
      //simulate async response
      $scope.items.push('New Item ' + Math.floor(Math.random() * 1000) + 4);

      //Stop the ion-refresher from spinning
      $scope.$broadcast('scroll.refreshComplete');
    
    }, 1000);
      
  };
  
   $scope.method = 'GET';
   $scope.url = 'www.url.com';

        $scope.fetch = function() {
            $scope.code = null;
            $scope.response = null;

            $http({method: $scope.method, url: $scope.url, cache: $templateCache}).
            success(function(data, status) {
                $scope.data = data || "Request Failed";
                $scope.status = status;

            });
        };
    $scope.updateModel = function(method, url) {
        $scope.method = method;
        $scope.url = url;
    };
})

.controller('ShopDetailCtrl', function($scope, $stateParams, Shop) {
    $scope.shop = Shop.get($stateParams.shopId);
})

.controller('AccountCtrl', function($scope) {
})

.controller('BluetoothCtrl', function($scope) {
});

and I keep getting this error in the console.

Uncaught ReferenceError: $urlRouterProvider is not defined
?restart=251178:1 XMLHttpRequest cannot load http://ab.thewebsite.com. No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:8100’ is therefore not allowed access.
controllers.js:25 Refreshing!

1 Like

updated my controller to this for shop.html…

.controller('ShopCtrl', function($scope,$state, $http, $templateCache, Shop) {
$scope.doRefresh = function() {

console.log('Refreshing!');
$timeout( function() {
//simulate async response
$scope.items.push('New Item ' + Math.floor(Math.random() * 1000) + 4);

//Stop the ion-refresher from spinning
$scope.$broadcast('scroll.refreshComplete');

}, 1000);
  
};

 // Simple GET request example :
$http.get('http://ab.thewebsite.com/stuff/').
success(function(data, status, headers, config) {
// this callback will be called asynchronously
// when the response is available
}).
error(function(data, status, headers, config) {
// called asynchronously if an error occurs
// or server returns response with an error status.
});
})
1 Like

http://scottbolinger.com/ionic-wordpress-app/