AngularJS 1.2 $ kim phun: modulerr


445

Khi sử dụng angular 1.2 thay vì 1.07, đoạn mã sau không còn hợp lệ nữa, tại sao?

'use strict';

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

app.config(['$routeProvider', '$locationProvider',
    function($routeProvider, $locationProvider) {
        $locationProvider.html5Mode(true);
        $routeProvider.
        when('/', {
            templateUrl: 'part.html',
            controller: 'MyCtrl'
        }).
        otherwise({
            redirectTo: '/'
        });
    }
]);

vấn đề nằm ở phần cấu hình kim phun (app.config):

Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.0rc1/$injector/modulerr?p0=muninn&p1=Error%…eapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.0rc1%2Fangular.min.js%3A31%3A252) 

Nếu tôi nhớ chính xác thì vấn đề này bắt đầu với góc 1.1.6.

Câu trả lời:


636

Vấn đề là do thiếu mô-đun ngRoute. Kể từ phiên bản 1.1.6, đây là một phần riêng biệt:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js"></script>

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

492
Nếu bạn không chắc chắn thiếu mô-đun nào, hãy sử dụng angular.js chưa được rút gọn để đưa ra thông báo lỗi có thể đọc được:"Error: [$injector:nomod] Module 'ngRoute' 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."
Mart

2
Hmm, tôi đang sử dụng Bower và nó cung cấp các tệp .map - Tôi tự hỏi tại sao Chrome vẫn hiển thị cho tôi các lỗi từ tệp được rút gọn. Cảm ơn những người đứng đầu, @Mart!
MP Aditya

5
@ arg20, bạn sẽ tìm thấy câu trả lời tại đây: github.com/angular/angular.js/commit/ mẹo
Laurent

4
Bò thần tôi đã tìm kiếm MỌI NƠI để tìm giải pháp cho vấn đề này. Tôi đã nâng cấp từ 1.0 lên 1.2 và gặp lỗi này. Lời khuyên duy nhất tôi có thể tìm thấy là đảm bảo angular-route.js được bao gồm, đó là .... Không phải là người hâm mộ của các tài liệu Angular. Dù sao thì cũng cám ơn bạn! Tôi đã bỏ phiếu.
RachelD

4
Bạn có thể gặp lỗi này nếu bạn sử dụng angular.module ('myModule') thay vì angular.module ('myModule', []) trong khi xác định mô-đun của bạn. stackoverflow.com/questions/16260538/ cường
Anirudhan J

42

lỗi của tôi biến mất bằng cách thêm '()' này vào cuối

(function(){
    var home = angular.module('home',[]);

    home.controller('QuestionsController',function(){
        console.log("controller initialized");
        this.addPoll = function(){
            console.log("inside function");
        };
    });
})();

40

Một điều nữa để thêm vào danh sách vì đây là kết quả đầu tiên xuất hiện với tìm kiếm google về 'Lỗi: [$ kim phun: modulerr] góc cạnh':

Nếu bạn có sự không khớp giữa tên ứng dụng của bạn trong 'index'html' và trong định nghĩa ứng dụng javascript chính của bạn, điều này cũng có thể tạo ra lỗi này.

Ví dụ: nếu HTML của bạn trông như thế này:

    </head>
    <body ng-app="myWebSite">

        <!-- My Web Site -->
        <p>About my web site...</p>

        etc ...

Và JavaScript của bạn trông như thế này (nghĩa là có một lỗi đánh máy trên tên ứng dụng - myWebCite thay vì myWebSite):

/** Main AngularJS Web Application */ 
var app = angular.module('myWebCite', [ 'ngRoute' ]); 

/** Configure the Routes */ 
app.config(['$routeProvider', function ($routeProvider) { 
  etc ...

sau đó, lỗi 'Lỗi: [$ kim phun: modulerr] góc' cũng sẽ được tạo.


Tôi đã rất gần với điều này. Tôi đã đặt ng-app = "app" ... và sau đó không bao giờ thiết lập mô-đun. Vì vậy, nó đã bị vấp lỗi. Khi mới bắt đầu, tôi chỉ cần xóa phần = "ứng dụng" để mã mẫu của tôi hoạt động. Sau đó, tôi thiết lập mô-đun và định tuyến thích hợp ... :)
Eric Burdo

25

Một lỗi noob có thể được quên để bao gồm các mô-đun js

<script src="app/modules/myModule.js"></script>

các tệp trong index.html ở tất cả


24
Thật ngạc nhiên khi các thông báo gỡ lỗi / lỗi ở góc độ.
K - Độc tính trong SO đang tăng lên.

3
CƯỜI LỚN. Tôi tự nhủ, không, tôi không thể mắc lỗi đơn giản này. Và tôi đã thông qua câu trả lời của bạn nhiều lần. Nhưng nó đã giải quyết vấn đề của tôi.
Maubeh

Đó là về một số nhập khẩu bị thiếu
famas23

13

Đối với những người sử dụng các khung nén, bó và thu nhỏ tệp, hãy đảm bảo bạn xác định rõ ràng từng phụ thuộc vì các khung này có xu hướng đổi tên các biến của bạn. Điều đó đã xảy ra với tôi trong khi sử dụng ASP.NET BundleConfig.csđể gói các tập lệnh ứng dụng của tôi lại với nhau.

Trước

app.config(function($routeProvider) {
    $routeProvider.
      when('/', {
          templateUrl: 'list.html',
          controller: 'ListController'
      }).
      when('/items/:itemId', {
          templateUrl: 'details.html',
          controller: 'DetailsController'
      }).
      otherwise({
          redirectTo: '/'
      });
});

Sau

app.config(["$routeProvider", function($routeProvider) {
    $routeProvider.
      when('/', {
          templateUrl: 'list.html',
          controller: 'ListController'
      }).
      when('/items/:itemId', {
          templateUrl: 'details.html',
          controller: 'DetailsController'
      }).
      otherwise({
          redirectTo: '/'
      });
}]);

Đọc thêm ở đây về chú thích phụ thuộc góc.


12

Nếu bạn gặp lỗi này trong bảng điều khiển ([$injector:nomod], MINERR_ASSET:22), hãy đảm bảo bạn không bao gồm mã ứng dụng của mình trước khi tảiAngularJS

Tôi đã làm điều đó và một khi tôi đã sửa lỗi, lỗi đã biến mất.


9

Tôi vừa trải qua lỗi tương tự, trong trường hợp của tôi, đó là do tham số thứ hai angular.modulebị thiếu - hy vọng điều này có thể giúp được ai đó có cùng vấn đề.

angular.module('MyApp');

angular.module('MyApp', []);


1
Đây là vấn đề của tôi; Tôi đã bỏ lỡ một tuyên bố của angular.module ('my.Namespace', []); trước khi sử dụng angular.module ('my.Namespace'). directive ('myDirective', [...
ScottFoster1000


6

Tôi đã có cùng một vấn đề và đã thử tất cả các giải pháp có thể. Nhưng cuối cùng tôi đã biết từ tài liệu rằng ngRoutemô-đun bây giờ được tách ra. Hãy xem liên kết này

Giải pháp: Thêm cdn angular-route.js sau tập lệnh angular.min.js

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.js"></script>

5

Một kích hoạt khác cho lỗi này là để lại dấu "." ra trước "cách khác" hoặc bất kỳ tuyến đường nào khác trong định nghĩa tuyến đường của bạn:

  app.config(['$routeProvider',
     function($routeProvider) {
        $routeProvider.
           when('/view1', {
              templateUrl: 'partials/view1.html',
              controller: 'Ctrl1'
           }).
           otherwise({
              redirectTo: '/viewCounts'
           });
     }]);

Thế chấp bởi một điểm dừng hoàn toàn, một lần nữa. Phải yêu JS!


4

Ngoài câu trả lời bên dưới, nếu bạn gặp lỗi này trong bảng điều khiển ( [$injector:nomod], MINERR_ASSET:22), nhưng mọi thứ dường như hoạt động tốt, hãy đảm bảo rằng bạn không có bản sao bao gồm trong index.html của bạn.

Bởi vì lỗi này cũng có thể được nêu ra nếu bạn có các tệp trùng lặp bao gồm các tệp, sử dụng mô-đun này và được bao gồm trước tệp có khai báo mô-đun thực tế.


3

Nếu bạn xem qua hướng dẫn chính thức của angularjs https://docs.angularjs.org/tutorial/step_07

Lưu ý: Bắt đầu với AngularJS phiên bản 1.2, ngRoute nằm trong mô-đun của chính nó và phải được tải bằng cách tải tệp angular-route.js bổ sung mà chúng tôi tải xuống qua Bower ở trên.

Ngoài ra, vui lòng lưu ý từ ngRoute api https://docs.angularjs.org/api/ngRoute

Cài đặt Đầu tiên bao gồm angular-route.js trong HTML của bạn:

Bạn có thể tải xuống tệp này từ những nơi sau:

Google CDN, vd: angular-route.js "trong đó XYZ là phiên bản AngularJS bạn đang chạy.

Sau đó tải mô-đun trong ứng dụng của bạn bằng cách thêm nó dưới dạng mô-đun phụ thuộc:

angular.module ('ứng dụng', ['ngRoute']); Với điều đó bạn đã sẵn sàng để bắt đầu!


2

John Papa cung cấp vấn đề của tôi trên này bình luận khá mơ hồ: Đôi khi bạn nhận được lỗi đó, nó có nghĩa là bạn đang thiếu một tập tin. Lần khác, nó có nghĩa là mô-đun đã được xác định sau khi nó được sử dụng. Một cách để giải quyết vấn đề này một cách dễ dàng là đặt tên cho các tệp mô-đun * .module.js và tải chúng trước.


0

Vấn đề của tôi là ở cấu hình. Thay đổi:

<access origin="*" launch-external="yes"/>

đến

<access origin="*"/>

Đã sửa nó.


0

Đó là một lỗi kim phun. Bạn có thể đã sử dụng nhiều tệp JavaScript để trình tiêm có thể bị thiếu.

Một số ở đây:

var app = angular.module('app', 
    ['ngSanitize', 'ui.router', 'pascalprecht.translate', 'ngResource', 
     'ngMaterial', 'angularMoment','md.data.table', 'angularFileUpload', 
     'ngMessages', 'ui.utils.masks', 'angular-sortable-view',          
     'mdPickers','ngDraggable','as.sortable', 'ngAnimate', 'ngTouch']
);

Vui lòng kiểm tra kim phun bạn cần chèn app.js


0

Thỉnh thoảng tôi đã thấy lỗi này khi bạn chuyển đổi giữa các dự án và chạy các dự án trên cùng một cổng lần lượt. Trong trường hợp đó, goto chrome Công cụ dành cho nhà phát triển> Mạng và thử kiểm tra tệp js thực tế bằng văn bản cho : if the file match with the workspce. Để giải quyết điều này chọn Disable Cachetheo mạng.


0

Sau nhiều tháng, tôi trở lại để phát triển AngularJS ( ứng dụng 1.6.4 ), trong đó tôi đã chọn Chrome (PC) và Safari (MAC) để thử nghiệm trong quá trình phát triển. Mã này đã trình bày Lỗi này : $ kim phun: Lỗi mô-đun modulerr trên IE 11.0.9600 (Windows 7, 32-bit).

Sau khi điều tra, rõ ràng là lỗi là do forEach vòng lặp được sử dụng, chỉ cần thay thế tất cả các foreach vòng lặp với bình thường cho vòng cho những thứ để làm việc như nó vốn có ...

Về cơ bản, đây là một vấn đề IE11 (đã trả lời ở đây ) chứ không phải là vấn đề AngularJS, nhưng tôi muốn đặt câu trả lời này ở đây vì ngoại lệ nêu ra là ngoại lệ AngularJS. Hy vọng nó sẽ giúp một số người trong chúng ta ra khỏi đó.

tương tự không sử dụng các hàm lambda ... chỉ cần thay thế () => {...} bằng hàm ol 'tốt () {...}


0

Tôi đã có vấn đề này và sau khi kiểm tra từng dòng mã của tôi, tôi đã thấy điều này

 <textarea class="form-control" type="text" ng-model="WallDesc" placeholder="Enter Your Description"/>

tôi vừa đổi nó thành

     <textarea class="form-control" type="text" ng-model="WallDesc" placeholder="Enter Your Description"></textarea>

và nó đã hoạt động. vì vậy hãy kiểm tra thẻ của bạn

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.