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', [
    ($http,$scope,$routeParams) ->
    ).success (data) ->
        $scope.tabs = data

    $http.get('').success (data) ->
       $scope.tabs = data

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:

 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 or, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply