Angular.js：未被捕獲的錯誤，沒有模塊：myapp

我想要引導一個angular.js項目。這是我的index.html：Angular.js：未被捕獲的錯誤，沒有模塊：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>

頭上的url 'app'簡單地打印子路徑，/應用程序，例如。這是我的app.js：

'use strict'; 

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

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

的問題是，每次我嘗試運行它，將引發異常：Uncaught Error: No module: myapp，這是幾乎相同的方式angular-seed作品。我搜索谷歌和StackOverflow，但沒有答案（one和two）幫助我。

這裏是關於我的錯誤的fiddle（你應該打開瀏覽器的控制檯才能看到它）。出了什麼問題？

來源

2013-06-24 Lucas Sampaio

你可以讓小提琴重現問題嗎？ – Blackhole

@Blackhole，它是[這裏]（http://jsfiddle.net/vvfnN/）。我盡我所能把它放在jsFiddle上（打開你的控制檯查看問題）。 –

我認爲你的STATIC_URL變量沒有被定義。它不在角度範圍內，因此您無法使用{{}}。嘗試使用常量字符串替代src而不是角度變量。 –

腳本的順序是非常重要的，儘量把它放在你的<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>

這裏試試：

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

來源

2013-06-24 19:43:19 AlexCheuk

補充AlexCheuk的回答，我意識到，我的應用程序.js文件涉及關閉：

(function($) { 
    'use strict'; 

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

刪除它關閉它的工作（沒有改變訂單亞歷克斯說）！我不知道爲什麼，但沒關係。

來源

2013-06-24 19:54:02

@lsmagalhaes，刪除jQuery的ready調用修復了您的問題的原因是Angular會引導DOMContentLoaded事件，這恰好與jQuery調用它的ready handler相同。發生什麼事情是Angular會引導並根據ng-app的值查找你的模塊，但由於jQuery ready處理程序還沒有運行，模塊還沒有被創建。這就是爲什麼你得到'未捕獲的錯誤：沒有模塊：myapp'錯誤。 – dskang

這實際上似乎是答案。在jsFiddle上，只需在「無包裹頭」或「無包裹體」中加載angularjs，並且錯誤消失。謝謝。 –

-4

我遇到了類似的問題，在那裏，而運行Yeoman/grunt服務器。什麼修復了我，重新啓動grunt服務器。

來源

2013-08-21 21:22:24 TOBlender

這與這個問題無關。 –

在我的情況下，當使用IIFE表示法時，我忘記了自調用括號。

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

來源

2015-06-11 19:43:58 Erkan

*忘了請，RIP英語 – Xsmael

謝謝你，現在英國人提高 – Erkan

我面臨着同樣的問題，但沒有上述伎倆的工作對我來說，但是這一次，看到設置在圖像從「的OnLoad」改爲「無包裝 - 」

變化

來源

2016-09-01 02:34:18

很好的答案..這對我很有用,,謝謝....你能解釋一下什麼是無包裝的意思 – user3501613

我面臨着同樣的錯誤，但我犯了一個愚蠢的錯誤，我沒有在我的jsp頁面中包含controller.js文件。只是這包括：

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

而且工作非常出色。

來源

2017-11-22 04:42:43

Angular.js：未被捕獲的錯誤，沒有模塊：myapp

回答

相關問題