Angularjs fails http get request

Question

I am trying some angularjs tutorials and dont know why the dropdown does not populate.

I get an error in angular.js file

TypeError: undefined is not a function. 
if ($rootScope.$broadcast('$locationChangeStart', newUrl,
                                    oldUrl).defaultPrevented) {

below is my code.

<!DOCTYPE html>
<html>
<head>
<link rel="" type="text/css" href="bootstrap.min.js" />
</head>
<body ng-app = "subtitle" ng-controller="loginController">
<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript" src="app.js"></script> 
<select ng-model="collections" ng-options="item.Id as item.Name for item in languages">
    <option value="">Select Account</option>
</select>
</body>
</html>

(function(){

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

app.controller('loginController', ['$http','$scope',function($scope,$http) {
$scope.collections = null;
$scope.languages = [];

$http.get('http://lapi.cd.com/masterdata?type=languages').success(function(data) {
$scope.languages = data;
});
}]);

})();

Omri Aharon · Accepted Answer · 2015-02-14 09:18:14Z

3

You have switched the order of the variables in the controller:

app.controller('loginController', ['$http','$scope',function($scope,$http)

Switch to:

app.controller('loginController', ['$http','$scope',function($http,$scope)

answered Feb 14, 2015 at 9:18

Omri Aharon

17.1k5 gold badges43 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

sham Over a year ago

Exactly, what I failed to detect.

Jakub Barczyk · Accepted Answer · 2015-02-14 09:21:03Z

0

First of all, the order of injections you make is not right. It must be fixed, as shown below:

app.controller('loginController', ['$scope', '$http' , function($scope, $http) { ... }]);

('ctrlName', ['A', 'B', function(A, B) ...

answered Feb 14, 2015 at 9:21

Jakub Barczyk

6051 gold badge5 silver badges11 bronze badges

Comments

Anil Singh · Accepted Answer · 2015-02-14 09:24:11Z

It might help you!!! plnker

<!DOCTYPE html>
<html>

<head>
  <link rel="stylesheet" href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css">
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.4/angular.js"></script>
  <script>
    var app = angular.module('subtitle', []);
    app.controller('loginController', ['$http', '$scope',
      function($http,$scope) {
        $scope.collections = null;
        $scope.languages = [];

        $http.get('http://lapi.cd.com/masterdata?type=languages').success(function(data) {
          $scope.languages = data;
        });
      }
    ]);
  </script>
</head>

<body ng-app="subtitle" ng-controller="loginController">
  <select ng-model="collections" ng-options="item.Id as item.Name for item in languages">
    <option value="">Select Account</option>
  </select>
</body>

</html>

Collectives™ on Stack Overflow

Angularjs fails http get request

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related