Failing to use/integrate restangular into my AngularJS app

Issue

I am trying to build a small AngularJS app to work on a page I have created with the use of restangular for consuming the apis but I keep getting the following error:

Error: [$injector:modulerr] Failed to instantiate module productConnectApp due to:

[$injector:unpr] Unknown provider: a
http://errors.angularjs.org/1.5.5/$injector/unpr?p0=a

The errors seems to be happening in the lodash library which I have included as restangular is dependent on lodash. I have installed restangular using bower.

My page includes:

<script src="../bower_components/angular/angular.js"></script>
<script src="../bower_components/lodash/lodash.js"></script>
<script src="../bower_components/restangular/dist/restangular.js"></script>
<script src="scripts/app.js"></script>
<script src="scripts/controllers.js"></script>
<script src="scripts/services.js"></script>

My app.js file that I am trying to use to enable restangular

angular.module('productConnectApp', ['restangular'])
.config(function(RestangularProvider) {
    RestangularProvider.setBaseUrl('http://localhost:3000/api/');
    //RestangularProvider.setDefaultHttpFields({cache: true});
    //RestangularProvider.setMethodOverriders(["put", "patch"]);
})
.controller('homeController', ['$scope', function($scope, Restangular) {
    //alert('all good');
    console.log('all goood');
    var baseClients = Restangular.all('clients');
    var baseProducts = Restangular.all('products');
    baseClients.getList().then(
        function(clients){
            $scope.clients = clients;
        },
        function(){
            console.log('error fetching clients');
        });
    baseProducts.getList().then(
        function(products){
            $scope.products = products;
        }, function() {
            console.log('error fetching products');
        });
}]);

Solution

.config(function(RestangularProvider) { ... })

uses implicit annotation, which isn’t compatible with minification, explicit annotation should be used instead.

Use strict mode to avoid accidental implicit annotation.

.controller('homeController', ['$scope', function($scope, Restangular) { ... })

inline annotation is specified incorrectly, Restangular won’t be injected.

Answered By – Estus Flask

Answer Checked By – Clifford M. (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.