2017-07-12 2 views
1

Ich bin der Versuchen AngularJS: Anfängerhandbuch auf udemy und ich habe ein seltsames Problem. Der folgende Code funktioniert für den Kursmanager, nicht jedoch für einige Benutzer.AngularJS-Controller nicht beim Kopieren von Code

index.html

<html lang="en" ng-app='try'> 
    <head> 
     <script src="./js/angular.min.js"></script> 

     <script src="./js/app/app.module.js"></script> 
     <script src="./js/app/app.config.js"></script> 

     <script src="./js/app/blog-list/blog-list.module.js"></script> 
     <script src="./js/app/blog-list/blog-list.component.js"></script> 
    </head> 

    <body> 
     <div class='' ng-controller='BlogListController'></div> 
    </body> 
</html> 

app.module.js

'use strict'; 
angular.module('try', ['blogList']); 

app.config.js

'use strict'; 
angular.module('try', []) 
    .config(function(){}); 

Blog-list.module.js

'use strict'; 
angular.module('blogList', []); 

Blog-list.component.js

'use strict'; 
angular.module('blogList'). 
    controller('BlogListController', function(){ 
     console.log("hello") 
    }); 

Ich erhalte einen Fehler

Den Controller mit dem Namen 'BlogListController' ist nicht registriert.

Aber wenn in der Datei Blog-list.component.js ich die Modulnamen ändern:

'use strict'; 
angular.module('try').   <---- CHANGED THIS 
    controller('BlogListController', function(){ 
     console.log("hello") 
    }); 

Es funktioniert.

Warum funktioniert der Code vor dem Fix für den Kursmanager? Was ist die richtige Antwort?

PS: Alles wird in der Reihenfolge geladen, die die index.html Dateien angibt.

Vielen Dank im Voraus.

+0

weil der Controller nicht innerhalb des 'try' Moduls existiert. was du in der html 'ng-app = 'try' deklariert hast. füge 'ng-pp =" blogList "' in html hinzu, dann funktioniert das. –

+0

@SibiRaj Warum funktioniert der Code des Instruktors mit 'ng-app =" try "'? –

+0

Ich weiß nicht, was der Ausbilder gesagt hat. eine einfache Logik. Sie haben das in einem anderen Modul definiert. Wie kann man erwarten, dass irgendwo gearbeitet wird, wo der Controller nie definiert ist –

Antwort

1

Das Modul try wird ohne eine Abhängigkeit vom Modul blogList geladen, da app.config.js einen sehr subtilen Fehler enthält.

Beachten Sie, dass die Funktion angular.module auf zwei Arten verwendet werden kann: zum Abrufen eines Moduls und zum Erstellen eines neuen Moduls. Ein neues Modul wird erstellt, wenn ein zweites Argument bereitgestellt wird. Dieses zweite Argument enthält die Abhängigkeiten des Moduls.

Das bedeutet, dass das Modul in dieser Anwendung wie folgt geladen wird: Zuerst erstellt angular.module('try', ['blogList']) ein neues Modul mit dem Namen try mit einer Abhängigkeit von blogList. Dann angular.module('try', []).config(function(){}) erstellt ein neues Modul mit dem Namen try ohne Abhängigkeiten, überschreiben die vorherigen try.

einfach das zweite Argument entfernen, so app.config.js wie folgt aussieht:

'use strict'; 
angular.module('try') 
    .config(function(){}); 

und es sollte immer funktionieren.

Verwandte Themen