2012-10-20 12 views
16

EDIT: Dzieje się tylko z IE (testowane na IE10)angularjs nie załadować moduł

Mam app, który ładuje w porządku początkowo jednak, gdy odświeżane daje ten błąd:

SCRIPT5022: No module: myAppModule

myAppModule jest modułem kątowe zdefiniowano w app.js który jest ładowany po załadowaniu angularjs

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

i automatycznego bootstrapped przez:

<html ng-app="myAppModule"> 

skrypty ładowane są następujące (nie AMD ładowarka):

<script>window.jQuery || 
    document.write('<script src="js/vendor/jquery-1.8.0.min.js"></script>')</script> 
<script>window.angular || 
    document.write('<script src="js/vendor/angular-1.0.2.min.js"></script>')</script> 

<script src="js/app.js"></script> 
<script src="js/controller.js"></script> 

Sądzę, że angularjs jest uzyskiwanie ładowany pierwszy i automatyczne ładowanie początkowe aplikację, ale app.js nie została jeszcze załadowana

+0

Hmm, to bardzo dziwne, AngularJS normalnie rozpocznie moduły doładowania po pełnym załadowaniu. Czy mógłbyś udostępnić trochę więcej informacji: używaną przeglądarkę, metodę ładowania scripsów (prosty tag ze scritami lub AMD) link do aplikacji, więcej kodu itp. Pluj byłby idealny. –

+3

edytowane. Uważam, że AngularJS jest w pełni załadowany, zanim app.js ma szansę załadować? czy to możliwe? – nehz

+0

Z ciekawości: czy można spróbować załadować jquery i kątowe za pomocą zwykłego tagu

3

Miałem ten sam problem, tylko w IE9. Niższe wersje IE rzeczywiście działały dobrze, podobnie jak nowsze przeglądarki.

Ręczne ładowanie rozwiązało problem, ale spowodowało błąd "Nieznany dostawca" dla filtra, który jest częścią mojego modułu. Zauważ, że filtr nadal działał zgodnie z oczekiwaniami.

Ostatecznie rozwiązaniem, które rozwiązało mój problem i przestałem generować błędy, było po prostu zmienić nazwę pliku modułu tak, aby był taki sam jak moduł.

Więc jeśli nazwa mojego modułu to myAppModule, nazwa pliku powinna być myAppModule.js, a nie my_app_module.js.

6

Czułem się jak idiota i kiedy znalazłem to, co robię źle, ale w przypadku jesteś podobny do mnie, to oto kilka innych rzeczy do sprawdzenia pierwszy:

  1. upewnić się, że dziecko jest moduł ładowania pierwszy. W moim przypadku musiałem się upewnić, że moduł podrzędny był fizycznie przed moim modułem macierzystym. Możesz to potwierdzić, umieszczając punkt przerwania na każdym wierszu inicjalizacji modułu.
  2. Nawet przy prawidłowym porządku fizycznym kolejność wykonywania była wciąż wyłączona. Jeden z moich modułów był zawijany w funkcję samowykonania, a drugi nie. Doh.
  3. Wystąpił błąd w funkcji podrzędnej, który spowodował, że błąd pojawił się dwukrotnie w konsoli. To dlatego, że używam składni takiego:

    var mod = angular.module("blah", []); 
    mod.filter("filterName", function(){ ... }); 
    

    W pewnym momencie zapomniałem puste nawiasy podczas uruchamiania modułu, więc linia wyglądało to i rzucił ten błąd:

    var mod = angular.module("blah"); // <-- wrong 
    

Aby podsumować, upewnij się, że moduł podrzędny jest wykonywany jako pierwszy i nie zawiera błędów.

0

Nawiasem mówiąc, używając Angular 1.0.6, ładowanie jQuery przed kątowością (zakodowane znaczniki skryptu) powoduje, że IE10 wyrzuca błąd "brak modułu".

Jedyną opcją, którą mogę znaleźć, aby to poprawić jest ręczne ładowanie i zapewnienie, że mój app.js określa, że ​​moduł został załadowany po wszystkich innych odniesieniach do modułu potomnego (jak wspomniano o Barnabie).

0

Ten sam problem wystąpił tylko w IE. Było to spowodowane przez typo (niektóre kot musi wszedł na klawiaturze):

<script type=" text/javascript" src="assets/js/app.js"></script> 

Największy przestrzeń wartości atrybutu typu była przyczyną problemu. Jak tylko została usunięta, aplikacja znowu działała dobrze.

1
app.config(['$stateProvider', ($stateProvider) => { 
    $stateProvider.state('login', { 
    url: '/login', 
    templateUrl: 'partials/login.html' 
    }).state('dashboard', { 
    url: '/dashboard', 
    templateUrl: 'partials/dashboard.html' 
    }) 
}]) 

W moim przypadku Internet Explorer nie podobał się funkcji strzałki. Zmiana ich na funkcję() {} notacja rozwiązała problem:

app.config(['$stateProvider', function ($stateProvider) { 
    $stateProvider.state('login', { 
    url: '/login', 
    templateUrl: 'partials/login.html' 
    }).state('dashboard', { 
    url: '/dashboard', 
    templateUrl: 'partials/dashboard.html' 
    }) 
}]) 
Powiązane problemy