modulerr module error

**tunisiano44** · 17/07/2017, 13h10

Bonjour,
je trouve cette erreur quand écrire code angular js:

https://docs.angularjs.org/error/$injector/modulerr?p0=myApp&p1=Error:%20%5B$injector:nomod%5D%20http:%2F%2Ferrors.angularjs.org%2F1.6.5%2F$injector%2Fnomod%3Fp0%3DmyApp%0A%20%20%20%20at%20https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.6.5%2Fangular.min.js:7:76%0A%20%20%20%20at%20https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.6.5%2Fangular.min.js:26:408%0A%20%20%20%20at%20b%20(https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.6.5%2Fangular.min.js:25:439)%0A%20%20%20%20at%20https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.6.5%2Fangular.min.js:26:182%0A%20%20%20%20at%20https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.6.5%2Fangular.min.js:42:290%0A%20%20%20%20at%20p%20(https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.6.5%2Fangular.min.js:8:7)%0A%20%20%20%20at%20g%20(https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.6.5%2Fangular.min.js:42:138)%0A%20%20%20%20at%20gb%20(https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.6.5%2Fangular.min.js:46:251)%0A%20%20%20%20at%20c%20(https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.6.5%2Fangular.min.js:22:19)%0A%20%20%20%20at%20Uc%20(https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.6.5%2Fangular.min.js:22:332

code index.html:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
{% extends 'base.html.twig' %}
{% block title %} Acceuil {% endblock %}
{% block stylesheets %}<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/cerulean/bootstrap.min.css">
<style>
 
a {
    text-decoration:none;
    color: #e74c3c;
        margin-right: 25px;
 
}
 
</style>
 
{% endblock %}
{% block body %}
<div class="container" ng-app="myApp">
    <a href="#/!">Acceuil</a>
 
<a href="#!login">Login</a>
<a href="#!register">Register</a> <br><br>
 
<div ng-view></div>
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.5/angular-route.js"></script>
<script src="angularJwt.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/ngstorage/0.3.6/ngStorage.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/todc-bootstrap/3.3.7-3.3.13/js/bootstrap.min.js"></script>
<script type="text/javascript" src="{{ asset('bundles/fosjsrouting/js/router.js') }}"></script>
<script type="text/javascript" src="{{ path('fos_js_routing_js', {"callback": "fos.Router.setData"}) }}"></script>
<scritp src="app.js"></script>
<script>
</script>
 
</div>
{% endblock %}

code login.html:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>Login</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/cerulean/bootstrap.min.css">
<style>
 
body{
    background-color: #525252;
}
.centered-form{
	margin-top: 60px;
}
 
.centered-form .panel{
	background: rgba(255, 255, 255, 0.8);
	box-shadow: rgba(0, 0, 0, 0.3) 20px 20px 20px;
}
 
a {
    text-decoration:none;
    color: #e74c3c;
    margin-right: 25px;
}
 
</style>
</head>
<body>
 
<div class="container" ng-app="myApp">
	<div style="margin-top:50px;" class="row">
        <div class="col-md-4 col-md-offset-4">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title">Welcome</h3>
                </div>
                <div class="panel-body">
                    <form role="form">
                        <fieldset>
                            <div class="form-group">
                                <input class="form-control" placeholder="Username" ng-model="user" name="username" type="text" autofocus>
                            </div>
                            <div class="form-group">
                                <input class="form-control" placeholder="Password" ng-model="pass" name="password" type="password" value="">
                            </div>
                            <!-- Change this to a button or input when using this as a form -->
                            <button type="button" class="btn btn-success btn-block" ng-click="login()">Login</button>
                            <p>New Member? <a href="signUp.html" class="">Sign up</a></p>
                        </fieldset>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.5/angular-route.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/todc-bootstrap/3.3.7-3.3.13/js/bootstrap.min.js"></script>
</body>
</html>

code registere.html:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>Register</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.7/cerulean/bootstrap.min.css">
<style>
 
body{
    background-color: #525252;
}
.centered-form{
	margin-top: 60px;
}
 
.centered-form .panel{
	background: rgba(255, 255, 255, 0.8);
	box-shadow: rgba(0, 0, 0, 0.3) 20px 20px 20px;
}
 
a {
    text-decoration:none;
    color: #e74c3c;
        margin-right: 25px;
 
}
 
</style>
</head>
<body >
<div class="container" ng-app="myApp">
        <div class="row centered-form">
        <div class="col-xs-12 col-sm-8 col-md-4 col-sm-offset-2 col-md-offset-4">
        	<div class="panel panel-default">
        		<div class="panel-heading">
			    		<h3 class="panel-title text-center" >{{m}}</h3>
			 			</div>
			 			<div class="panel-body">
			    		<form role="form">
			    			<div class="row">
			    				<div >
			    					<div class="form-group">
			                <input type="text" name="first_name" id="first_name" ng-model="username" class="form-control input-sm" placeholder="Username">
			    					</div>
			    				</div>
			    				<div class="col-xs-6 col-sm-6 col-md-6">
 
			    			</div>
 
			    			<div class="form-group">
			    				<input type="email" name="email" id="email" ng-model="email" class="form-control input-sm" placeholder="Email Address">
			    			</div>
 
			    			<div class="row">
			    				<div class="col-xs-6 col-sm-6 col-md-6">
			    					<div class="form-group">
			    						<input type="password" name="password" ng-model="password" id="password" class="form-control input-sm" placeholder="Password">
			    					</div>
			    				</div>
			    				<div class="col-xs-6 col-sm-6 col-md-6">
			    					<div class="form-group">
			    						<input type="password" name="password_confirmation" ng-model="confirmationpass" id="password_confirmation" class="form-control input-sm" placeholder="Confirm Password">
			    					</div>
			    				</div>
			    			</div>
 
			    			<input type="submit" value="Register" ng-click="SendData()" class="btn btn-info btn-block">
 
			    		</form>
			    	</div>
	    		</div>
    		</div>
    	</div>
    </div>
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.5/angular-route.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/todc-bootstrap/3.3.7-3.3.13/js/bootstrap.min.js"></script>
 
 
 
</body>
</html>

et code app.js:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
var app = angular.module("myApp", ["ngRoute","ngStorage"]);
 
app.config(['$routeProvider', function($routeProvider) {
  $routeProvider
    .when("/login", {
      templateUrl: Routing.generate('login',
        {template:"default/login.html.twig"}),
        controller: 'loginctrl',
    })
    .when("/register", {
      templateUrl: Routing.generate('register',
        {template:"default/registere.html.twig"}),
      controller: 'httpgetctrl',  
    });
}]);
 
    app.controller("httpgetctrl", function ($scope, $http) {
 
        $scope.SendData = function () {
           // use $.param jQuery function to serialize data from JSON 
            var data = $.param({
                username: $scope.username,
                email: $scope.email,
                pass: $scope.password,
                confir: $scope.confirmationpass
            });
 
            var config = {
                headers : {
                    'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
                }
            }
 
            $http.post("{{path('register')}}", data, config)
            .then(function (response) {
                console.log("success");
            })
            .catch(function() {
                console.log("error");
  })
        };
 
    });
 
    app.controller("loginctrl", function ($scope, $http,$localStorage) {
 
        $scope.login = function () {
           // use $.param jQuery function to serialize data from JSON 
            var data = $.param({
                username: $scope.user,
                password: $scope.pass
            });
 
            var config = {
                headers : {
                    'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
                }
            }
 
            $http.post("{{path('login')}}", data, config)
            .then(function (response) {
                console.log("success");
                //$localStorage.LocalMessag = x ;
                //console.log($localStorage.LocalMessag);
            })
            .catch(function() {
                console.log("error");
  })
        };
 
    });

je déclare module MyApp en fichier app.js mais je trouve le probléme , quand il copie code app.js dans index.html cette erreur est disparâitre

aide moi s'il vous car je suis bloquée

et merci d'avance

**Marco46** · 17/07/2017, 22h32

Tu as donné toi même la réponse, ton script app.js n'est pas importé dans ton html, il ne peut donc pas s'exécuter.

Quand angular parse ton DOM et tombe sur la directive ng-app ayant pour valeur myApp, il cherche à charger le module myApp mais ne parvient pas à le trouver parce qu'il n'est pas importé dans ton html.

modulerr module error

AngularJS

Discussions similaires

Partager

Partager