Gopal Sharma Gopal Sharma - 4 months ago 8
AngularJS Question

Simple dependancy injection in Angularjs not working

(function () {
'use strict';

function myController($scope, $http) {
var vm = this;
$scope.text = "Delhi";
}

myController.$inject = ["$scope", "$http"];
angular
.module("app")
.controller("myController", myController);
})();


And My Html Code is here

<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="angular.js"></script>
<script src="app.js"></script>
</head>
<body ng-app="app">
<div ng-controller="myController">
<p>I am from {{text}}</p>
</div>
</body>
</html>


But I my project is not working as expected. Gives below error

https://www.dropbox.com/s/itd5ryar56zqcxn/Screenshot%202016-08-06%2023.46.04.png?dl=0

angular.js:68 Uncaught Error: [$injector:nomod] Module 'app' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.5.5/$injector/nomod?p0=app

Answer

There are few issues with the code,

(i) You need to define the module initially and then inject the controller

(ii) You forgot to add the empty dependencies to the module '[]'

(function () {
    "use strict"; 
    angular
       .module("app",[])
       .controller("myController", myController);
    function myController($scope, $http) {
        var vm = this;
        $scope.text = "Delhi";
    }
    myController.$inject = ["$scope", "$http"];    
}());

Here is the working App