Angular.js: Uncaught Fehler, kein Modul: myapp

Ich versuche auch Bootstrap ein angular.js Projekt. Das ist mein index.html:Angular.js: Uncaught Fehler, kein Modul: myapp

<!doctype html> 
<html ng-app="myapp"> 
<head> 
    <meta charset="utf-8"> 
    <base href="{% url 'app' %}" /> 

    <title>Project</title> 
</head> 
<body> 
    <div ng-view> 
     <p>Loading...</p> 
    </div> 

    <script> 
     var url = function(path) { return '{{ STATIC_URL }}' + path }; 
    </script> 
    <script src="{{ STATIC_URL }}js/jquery-1.10.1.js"></script> 
    <script src="{{ STATIC_URL }}js/angular.js"></script> 
    <script src="{{ STATIC_URL }}js/project/app.js"></script> 
    <script src="{{ STATIC_URL }}js/project/controllers.js"></script> 
</body> 
</html>

Die url 'app' auf dem Kopf einfach druckt die subpath,/app, zum Beispiel. Das ist mein app.js:

'use strict'; 

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

app.config(['$routeProvider', function($router) { 
    $router.when('/', { 
     templateUrl: url('partials/foo.html'), 
     controller: controllers.Foo 
    }); 
}]);

Das Problem ist, dass jedes Mal wenn ich versuche, es zu laufen, wird eine Ausnahme ausgelöst: Uncaught Error: No module: myapp, und das ist fast die gleiche Art und Weise angular-seed funktioniert. Ich suchte auf Google und StackOverflow, aber keine der Antworten (one und two) half mir.

Hier ist eine fiddle über meinen Fehler (Sie sollten die Browser-Konsole öffnen, um es zu sehen). Was läuft falsch?

Quelle

2013-06-24 Lucas Sampaio

Können Sie eine Geige machen, die das Problem reproduziert? – Blackhole

@Blackhole, es ist [hier] (http://jsfiddle.net/vvfnN/). Ich habe mein Bestes versucht, es auf jsFiddle zu setzen (öffne deine Konsole, um das Problem zu sehen). –

Ich denke, dass Ihre STATIC_URL-Variable nicht definiert ist. Es liegt außerhalb eines eckigen Bereichs, sodass Sie {{}} nicht verwenden können. Verwenden Sie eine konstante Zeichenfolge für Ihren Quellcode anstelle einer Winkelvariablen. –

Der Auftrag des Skriptes ist sehr wichtig, versuchen Sie es <head>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script> 
<script> 
    var app = angular.module('myapp', []); 

    app.controller('Ctrl', function($scope){ 
     $scope.variable = "Hello"; 
    }); 
</script> 
<body ng-app="myapp"> 
    <div ng-controller="Ctrl"> 
     <p>{{variable}}</p> 
    </div>  
</body>

in Putten Ausprobieren hier:

http://jsfiddle.net/vvfnN/2/

Quelle

2013-06-24 19:43:19 AlexCheuk

AlexCheuk ‚s Antwort Ergänzung, wurde mir klar, dass mein app .js-Datei war an einer Schließung beteiligt:

(function($) { 
    'use strict'; 

    // all angular.js stuff 
)(jQuery);

Das Entfernen der Schließung funktionierte (ohne die Anweisungen zu ändern, wie Alex sagte)! Ich weiß nicht genau warum, aber das ist in Ordnung.

Quelle

2013-06-24 19:54:02

@lsmagalhaes, der Grund, dass das Entfernen des Bereitschaftsanrufs von jQuery Ihr Problem behoben hat, ist, dass Angular beim Ereignis DOMContentLoaded bootstrap wird, das dasselbe Ereignis ist, bei dem jQuery seinen ready-Handler aufruft. Was passiert, ist, dass Angular bootstrap und suchen Sie nach Ihrem Modul auf der Grundlage der Wert von ng-app, aber da die jQuery ready-Handler noch nicht ausgeführt wurde, das Modul wurde noch nicht erstellt. Aus diesem Grund haben Sie den Fehler "Uncaught Error: No modul: myapp" erhalten. – dskang

Das scheint tatsächlich die Antwort zu sein. Auf jsFiddle laden Sie angularjs einfach auf "no-wrap -in head" oder "no-wrap -in body" und der Fehler ist weg. Vielen Dank. –

-4

Ich stieß auf ein ähnliches Problem, wo es, während Yeoman/Grunt Server ausgeführt. Was es für mich repariert hat, war das Starten des Grunt Servers.

Quelle

2013-08-21 21:22:24 TOBlender

Das hat nichts mit diesem Problem zu tun. –

In meinem Fall habe ich bei der Verwendung der IIFE-Notation die Klammern self invoke vergessen.

(function() { 
    angular.module("adminApp", []); 
}() //don't forget self invoke parentheses 
);

Quelle

2015-06-11 19:43:58 Erkan

* vergessen Sie bitte, RIP Englisch – Xsmael

danke Mann, jetzt Englisch wirft – Erkan

ich vor dem gleichen Problem, aber keines der oben genannten Trick für mich gearbeitet, aber diese finden Sie die Einstellung im Bild

Wechsel von „OnLoad“ auf „No wrap -“

Quelle

2016-09-01 02:34:18

sehr gute Antwort .. das ist für mich gearbeitet ,, Dankess ... können Sie erklären, was die Bedeutung von No wrap-in bedeutet – user3501613

Ich war mit dem gleichen Fehler konfrontiert, aber ich machte einen dummen Fehler, ich war nicht mit der controller.js Datei in meiner JSP-Seite. enthalten nur das:

<script type="text/javascript" src="${pageContext.request.contextPath}/resources/js/controller.js"></script>

und es funktionierte hervorragend.

Quelle

2017-11-22 04:42:43

Angular.js: Uncaught Fehler, kein Modul: myapp

Antwort

Verwandte Themen