Why am I getting the Angular $injector:modulerr error here? Using 1.5 beta

Leon Gaban picture Leon Gaban · Nov 1, 2015 · Viewed 11.1k times · Source

The markup

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Angular I</title>
    <link rel="stylesheet" href="css/style.css">
    <link rel="author" href="humans.txt">
</head>
<body ng-app="app">

    <section ng-controller="mainCtrl">
      <h1>My App</h1>
      <p>{{name}}</p>
    </section>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular-route.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular-animate.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular-resource.min.js"></script>

    <script src="script.js"></script>
</body>
</html>

The script.js

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

app.controller('mainCtrl', function($scope) {
    $scope.name = "Leon Gaban";
})

I'm including angular.min, angular-route and even angular-resource and animate...

Answer

Pankaj Parkar picture Pankaj Parkar · Nov 1, 2015

You had wrong ng-app module, it should be ng-app="friendsList" instead of app.

The error is not due to angular versions, it is because you are injecting wrong dependency in your app mdoule. Simply you can not inject mainCtrl inside your module as its controller mainCtrl which you are going to register with your module.

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

Also you should have ng-controller="mainCtrl" on html.

<section ng-controller="mainCtrl">

</section>