Wtryskiwacz AngularJS 1.2 $: moduł

445

Kiedy używasz kątowego 1.2 zamiast 1.07, następujący fragment kodu nie jest już ważny, dlaczego?

'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: '/'
        });
    }
]);

problem dotyczy części konfiguracji wtryskiwacza (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)

Jeśli dobrze pamiętam, ten problem zaczął się od kątowego 1.1.6.

javascript angularjs

— obuwia
źródło

636

Przyczyną problemu było brak włączenia modułu ngRoute. Od wersji 1.1.6 jest to osobna część:

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

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

— obuwia
źródło

492

Jeżeli nie jesteś pewien, który jest brakujący moduł, za pomocą nie minified angularjs który daje czytelny komunikat o błędzie:

"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, używam altany, która zapewnia pliki .map - zastanawiam się, dlaczego Chrome wciąż wyświetla mi błędy z pliku zminimalizowanego. Dzięki za heads-up, @Mart!

— Aditya, poseł

5

@ arg20, znajdziesz odpowiedź tutaj: github.com/angular/angular.js/commit/…

— Laurent

4

Święta krowa, szukałem KAŻDEGO rozwiązania. Uaktualniłem z 1.0 do 1.2 i dostałem ten błąd. Jedyną radą, jaką mogłem znaleźć, jest upewnienie się, że plik angular-route.js został uwzględniony, a to było .... Nie jestem fanem dokumentów Angular. W każdym razie dziękuję! Poparłem głosowanie.

— RachelD

4

Ten błąd może pojawić się, jeśli podczas definiowania modułu użyjesz angular.module („myModule”) zamiast angular.module („myModule”, []). stackoverflow.com/questions/16260538/…

— Anirudhan J

42

mój błąd zniknął, dodając na końcu to „()”

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

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

— arp
źródło

40

Jeszcze jedną rzecz, którą należy dodać do listy, ponieważ jest to pierwszy wynik wyszukiwania w Google „Błąd: [$ injector: modulerr] angular”:

Jeśli występuje rozbieżność między nazwą aplikacji w „indeksie” HTML a główną definicją aplikacji javascript, może to również spowodować wygenerowanie tego błędu.

Na przykład, jeśli Twój HTML wygląda tak:

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

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

        etc ...

Twój JavaScript wygląda tak (tzn. Ma literówkę w nazwie aplikacji - myWebCite zamiast myWebSite):

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

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

wygenerowany zostanie również błąd „Błąd: [$ injector: modulerr] kątowy”.

— Mick
źródło

Miałem bardzo blisko tego. Ustawiłem ng-app = "app" ... a potem nigdy nie instalowałem modułu. Więc to potknął błąd. Jako początkujący właśnie usunąłem element = "app", aby mój przykładowy kod działał. Później skonfigurowałem odpowiedni moduł i routing ... :)

— Eric Burdo

25

Błąd noob może zapominać o dołączeniu modułu js

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

pliki w pliku index.html w ogóle

— otherDewi
źródło

24

Zadziwiające, jak złe są komunikaty kątowe debugowania / błędów.

— K - Toksyczność w SO rośnie.

3

LOL. Powiedziałem sobie: nie, nie mogę popełnić tego prostego błędu. I przekazałem twoją odpowiedź wiele razy. Ale to rozwiązało mój problem.

— Maubeh

Chodzi o brak importu

— famas23

13

Dla tych, którzy używają frameworków, które kompresują, pakują i minimalizują pliki, upewnij się, że wyraźnie zdefiniowałeś każdą zależność, ponieważ te frameworki mają tendencję do zmiany nazw zmiennych. Zdarzyło mi się to podczas używania ASP.NET BundleConfig.csdo łączenia moich skryptów aplikacji.

Przed

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

Po

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

Przeczytaj tutaj więcej o Adnotacjach zależności kątowej.

— Mojżesz Machua
źródło

12

Jeśli masz ten błąd w konsoli ([$injector:nomod], MINERR_ASSET:22), upewnij się, że nie dołączasz kodu aplikacji przed załadowaniemAngularJS

Robiłem to i kiedy naprawiłem zamówienie, błąd zniknął.

— Jasdeep Singh
źródło

9

Właśnie wystąpił ten sam błąd, w moim przypadku był on spowodowany angular.modulebrakiem drugiego parametru - mam nadzieję, że może to pomóc komuś z tym samym problemem.

~~angular.module('MyApp');~~

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

— Anth12
źródło

1

To był mój problem; Brakowało mi deklaracji angular.module („my.Namespace”, []); przed użyciem angular.module („my.Namespace”). dyrektywa („myDirective”, [...

— ScottFoster1000,

7

add to link
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.0/angular-route.min.js"></script>

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

— SirajuddinLuck
źródło

Zapomniałeś, że musisz dołączyć src, gdy używasz określonych zależności!

— K - Toksyczność w SO rośnie.

6

Miałem ten sam problem i wypróbowałem wszystkie możliwe rozwiązania. Ale w końcu dowiedziałem się z dokumentacji, że ngRoutemoduł jest teraz oddzielony. Spójrz na ten link

Rozwiązanie: Dodaj skrypt cdn angular-route.js po skrypcie 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>

— Bastin Robin
źródło

5

Innym wyzwalaczem tego błędu jest pozostawienie „.” przed twoją „inną” lub inną trasą w definicji trasy:

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

Jeszcze raz zawstydzony kropką. Uwielbiam JS!

— Hilary
źródło

4

Oprócz poniższej odpowiedzi, jeśli masz ten błąd w konsoli ( [$injector:nomod], MINERR_ASSET:22), ale wszystko wydaje się działać dobrze, upewnij się, że nie masz duplikatów zawartych w pliku index.html.

Ponieważ ten błąd można również zgłosić, jeśli masz zduplikowane dołączenia plików, które używają tego modułu i są uwzględnione przed plikiem z rzeczywistą deklaracją modułu.

— pleerock
źródło

3

Jeśli przejdziesz przez oficjalny samouczek angularjs https://docs.angularjs.org/tutorial/step_07

Uwaga: Począwszy od AngularJS w wersji 1.2, ngRoute znajduje się we własnym module i należy go załadować, ładując dodatkowy plik angular-route.js, który pobieramy za pośrednictwem Bower powyżej.

Należy również pamiętać, że z ngRoute api https://docs.angularjs.org/api/ngRoute

Instalacja Najpierw dołącz angular-route.js do swojego HTML:

Możesz pobrać ten plik z następujących miejsc:

Google CDN np. //Ajax.googleapis.com/ajax/libs/angularjs/XYZ/angular-route.js Altana np. Altana instaluje trasę kątową @ XYZ code.angularjs.org np. „//Code.angularjs.org/XYZ/ angular-route.js ”, gdzie XYZ jest uruchomioną wersją AngularJS.

Następnie załaduj moduł do aplikacji, dodając go jako moduł zależny:

angular.module („app”, [„ngRoute”]); Dzięki temu możesz zacząć!

— zahid9i
źródło

2

John Papa przedstawił mój problem na temat tego dość niejasnego komentarza: czasami, gdy pojawia się ten błąd, oznacza to, że brakuje pliku. Innym razem oznacza to, że moduł został zdefiniowany po użyciu. Jednym ze sposobów rozwiązania tego problemu jest nazywanie plików modułów * .module.js i załadowanie ich w pierwszej kolejności.

— Josh
źródło

0

Mój problem był w pliku config.xml. Wymiana pieniędzy:

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

do

<access origin="*"/>

naprawione.

— Frank Conry
źródło

0

Jest to błąd wtryskiwacza. Być może korzystasz z wielu plików JavaScript, więc wtryskiwacz może nie być dostępny.

Niektóre są tutaj:

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']
);

Sprawdź wtryskiwacz, który musisz włożyć do swojego app.js

— Bipin Shilpakar
źródło

0

Czasami widziałem ten błąd podczas przełączania między projektami i uruchamiania projektów na tym samym porcie, jeden po drugim. W takim przypadku goto chrom Developer Tools> Sieć i spróbować sprawdzić rzeczywisty plik napisany js za: if the file match with the workspce. Aby rozwiązać ten problem, wybierz Disable Cachew sieci.

— Shashi Ranjan
źródło

0

Po wielu miesiącach wróciłem do opracowania aplikacji AngularJS ( 1.6.4 ), dla której wybrałem Chrome (PC) i Safari (MAC) do testowania podczas programowania. Ten kod przedstawiał ten błąd: $ injector: modulerr Error Module w IE 11.0.9600 (Windows 7, 32-bit).

Po zbadaniu okazało się, że błąd był spowodowany foreach pętli używany, tylko wymienić wszystkich foreach pętli z normalną do pętli na rzeczy do pracy jak jest ...

To był w zasadzie problem IE11 ( tutaj odpowiedziano ), a nie problem AngularJS, ale chcę umieścić tę odpowiedź tutaj, ponieważ zgłoszony wyjątek był wyjątkiem AngularJS. Mam nadzieję, że to pomoże niektórym z nas.

podobnie. nie używaj funkcji lambda ... wystarczy zastąpić () => {...} dobrą funkcją ol '() {...}

— Akber Iqbal
źródło

0

Miałem ten problem i po sprawdzeniu mojego kodu linia po linii zobaczyłem to

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

właśnie zmieniłem to na

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

i zadziałało. więc sprawdź swoje tagi.

— Aref Bozorgmehr
źródło