AngularJS: Cannot read property 'get' of undefined $http

Question

var myApp = angular.module('myApp',[]);

myApp.controller('Controller', function($scope, $interval){

    $interval(function($scope, $http){

        $http.get('test.json').success(function(data){
        $scope.notifications = data;
        });
    },5000);

});

Anyone See what exactly I'm doing wrong? The interval is working correctly, as the error repeats ever 5 seconds in Chrome's Console. Am I passing the $http correctly to the controller?

Answer 1

All Angular module should be injected in the constructor of the controller.

var myApp = angular.module('myApp',[]);
myApp.controller('Controller', function($http, $scope, $interval){

$interval(function(){
    $http.get('test.json').success(function(data){
          $scope.notifications = data;
    });
},5000);

});

Answer 2

You need to inject $http into your controller. (The same way you inject $scope and $interval.) You may be interested to read https://docs.angularjs.org/guide/di.

var myApp = angular.module('myApp',[]);
myApp.controller('Controller', function($scope, $interval, $http){

    $interval(function($scope, $http){

        $http.get('test.json').success(function(data){
        $scope.notifications = data;
        });
    },5000);

});

Answer 3

Like you injected the $interval service, you need to inject the $http service:

var myApp = angular.module('myApp',[]);

myApp.controller('Controller', function($scope, $interval, $http){

    $interval(function($scope, $http){

        $http.get('test.json').success(function(data){
        $scope.notifications = data;
        });
    },5000);

});

Answer 4

you need to pass in $http in your controller, as:

var myApp = angular.module('myApp', []).
myApp.controller('ImagesCtrl', ['$scope', '$http', '$interval', function ($scope, $http, $interval) {
    $interval(function(){

        $http.get('test.json').success(function(data){
        $scope.notifications = data;
        });
    },5000);
}]);