AngularJS $http.get returns undefined and $http() is not a function

All we need is an easy explanation of the problem, so here it is.

I’m building an app to dynamically load and display data from a database in AngularJS, but when I try to access my API (using either $http() or $http.get()), I receive errrors.
$http.get() error: TypeError: undefined is not a function, $http() error: TypeError: object is not a function

This specific error occurs in the code to dynamically load navigation tabs.

The code for both in CoffeeScript:

p4pControllers.controller 'navCtrl', [
    '$routeParams'
    '$scope'
    '$http'
    ($http,$scope,$routeParams) ->
        $http(
        method:'GET'
        url:'http://p4p-api.snyx.nl/tables'
    ).success (data) ->
        $scope.tabs = data
        return
    return

    $http.get('http://p4p-api.snyx.nl/tables').success (data) ->
       $scope.tabs = data
       return
    return
]

Does anyone see what I’m doing wrong here?

How to solve :

I know you bored from this bug, So we are here to help you! Take a deep breath and look at the explanation of your problem. We have many solutions to this problem, But we recommend you to use the first method because it is tested & true method that will 100% work for you.

Method 1

When using the array notation for injecting dependencies, the order of the arguments is important:

In your code:

['$routeParams',
 '$scope',
 '$http',
 function ($http, $scope, $routeParams)  {
    // $http argument        ==> $routeParams
    // $scope argument       ==> $scope (by coincidence)
    // $routeParams argument ==> $http
}

So, basically, you are doing $routeParams.get(), but $routeParams has no method get() (nor is it a function itself).

Note: Use and implement method 1 because this method fully tested our system.
Thank you 🙂

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply