Failed to instantiate module myApp due to: Error: [$injector:nomod]

Question

I am having an error on this code. I don't know why I am using angularjs 1.7.x version

$(document).ready(function () {
    $('#signupBtn-spinner').hide();

    var app = angular.module('myApp', []);
    $('#signupBtn').click(signup);
    function signup() {
        app.controller('signupController', ['$scope', '$http', function ($scope, $http) {
            alert('hello')
        }]);
    }    
})

Answer 1

I strongly recommend you to avoid to use jquery with Angular/js

If you want to implement signup/login logic, suggest you to use ui-router. Some example.

Also please read this great Josh David Miller's answer “Thinking in AngularJS” if I have a jQuery background

---

About your problem:

You get this error from ng-app.

Put var app = angular.module('myApp', []); out of $(document).ready

Angularjs is loaded and it does not see any module because it is still not ready.

---

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

$(document).ready(function () {
    $('#signupBtn-spinner').hide();
    
    $('#signupBtn').click(signup);
    function signup() {
        app.controller('signupController', ['$scope', '$http', function ($scope, $http) {
            alert('hello')
        }]);
    }    
})