angularjs functions ($http, $location, ...) are not working - angularjs

Question

I have a simple angularjs application and I would like to make http request, but I really don't know why it is not working. Here is my controller:
(function () {
'use strict';
/**
* #ngdoc function
* #name app.controller:HomeCtrl
* #description
* # HomeCtrl
* Controller of the app
*/
angular.module('BlurAdmin.pages.dashboard')
.controller('HomeCtrl', ['$scope', '$rootScope', '$stateParams', '$http', '$location', HomeCtrl ]);
function HomeCtrl($scope, $http, $location) {
$scope.samples = [['a', 'b', 'c'], ['d', 'e', 'f']];
console.log($http);
console.log($scope);
console.log($location);
console.log(window.location.hostname);
$http.get(
'http://localhost' + ':7000/samples',
{}
).then(function(err, data){
if (err){
console.log(err);
}
console.log(data);
},
function(err, data){
});
var varApplist = this;
}
})();
I my patial homeCtrl:
<div id="page-wrapper" ng-controller="HomeCtrl">
......
<div>
in my index.html
when I try to run, I am having this error:
TypeError: $http.get is not a function
at new HomeCtrl (http://localhost:4001/app/pages/dashboard/home/homeCtrl.js:21:11)
at invoke (http://localhost:4001/bower_components/angular/angular.js:4570:17)
at Object.instantiate (http://localhost:4001/bower_components/angular/angular.js:4578:27)
at http://localhost:4001/bower_components/angular/angular.js:9460:28
at http://localhost:4001/bower_components/angular-ui-router/release/angular-ui-router.js:4081:28
at invokeLinkFn (http://localhost:4001/bower_components/angular/angular.js:9099:9)
at nodeLinkFn (http://localhost:4001/bower_components/angular/angular.js:8586:11)
at compositeLinkFn (http://localhost:4001/bower_components/angular/angular.js:7975:13)
at publicLinkFn (http://localhost:4001/bower_components/angular/angular.js:7855:30)
at updateView (http://localhost:4001/bower_components/angular-ui-router/release/angular-ui-router.js:4021:23) <div ui-view="" class="ng-scope">
when I log $location and $http, I have and empty object.

Answer 1

.controller('HomeCtrl', ['$scope', '$rootScope', '$stateParams', '$http', '$location', HomeCtrl ]);
function HomeCtrl($scope, $http, $location) {
Except for $scope, the actual parameters of your function don't match, at all, with the dependencies declared at the beginning of the array.
Do yourself a favor, and stop using this ugly and bug-prone array notation. Use ng-annotate to make your code minifiable automatically.
Also note that the callback passed to then() will be called with a single argument. So the data argument you have there is useless.

Answer 2

need to match your dependency injection sequence with the string values
.controller('HomeCtrl', ['$scope', '$rootScope', '$stateParams', '$http', '$location',
function HomeCtrl($scope, $rootScope,$stateParams, $http, $location) {
When you are initializing the angular module, need to add empty squire brackets for the module injection
angular.module('BlurAdmin.pages.dashboard',[])
also remove err in your promise (then)
.then(function(data) {
console.log(data); // success response
},
function(data) {
console.log(data); // error resoponse
});
full controller
(function () {
'use strict';
angular.module('BlurAdmin.pages.dashboard',[])
.controller('HomeCtrl', ['$scope', '$rootScope', '$stateParams', '$http', '$location',
function HomeCtrl($scope, $rootScope,$stateParams, $http, $location) {
$scope.samples = [['a', 'b', 'c'], ['d', 'e', 'f']];
console.log($http);
console.log($scope);
console.log($location);
console.log(window.location.hostname);
$http.get(
'http://localhost' + ':7000/samples',
{}
).then(function(data){
console.log(data);
},
function(err){
console.log(err);
});
var varApplist = this;
}])
})();