Module ' ' 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.

While learning angular-js, I came across the following error:

Module 'myApp' 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.

The error seems to be straightforward that the module is not loaded. However, I cross-checked and found that module was there in the script and should have been loaded. My code looked like below:

  <table ng-app="myApp" ng-controller="testController">
        <tr ng-repeat="x in lstStrings">
            <td>{{ x }}</td>
        </tr>
    </table>

    <script type="text/javascript">
        var angApp = angular.module('myApp');
        angApp.controller('testController', function ($scope, $http) {
            $http.get('http://localhost:57964/api/test/getstringslist')
                  .then(function (response) {
                      $scope.lstStrings = response.data;
                  });
        });
    </script>

Then while comparing the code with some of the samples, I found that a very minor but very effective mistake which was causing the issues. The issue was that I was missing the second parameter of the angular.module function, So the missing part was the one highlighted below:

 <script type="text/javascript">
        var angApp = angular.module('myApp', []);
        angApp.controller('testController', function ($scope, $http) {
            $http.get('http://localhost:57964/api/test/getstringslist')
                  .then(function (response) {
                      $scope.lstStrings = response.data;
                  });
        });
    </script>

See how small the issue was, but it was the one that was breaking the application. As per official angular documentation, the second parameter is:

 This array is the list of modules myApp depends on.

This is a required parameter and can be specified as blank, if there is no dependency of other modules, on this one. Hope this helps somebody else also...!!! Happy coding.

Error: [ngModel:nonassign] http://errors.angularjs.org/1.4.5/ngModel/nonassign?p0

While working with angular js, i encountered an issue of the following type:

Error: [ngModel:nonassign] http://errors.angularjs.org/1.4.5/ngModel/nonassign?p0


I researched a bit and found that the issue occurs due to the fact that I was trying to call a controller function using the ng-model, which is not correct.

Just call the function using the following syntax:

  <span>{{ calculateSum() }}</span> 

or 

  <span  ng-bind="calculateSum()"></span>

The first one uses the Expressions and second one uses the ng-bind directive.