Angular JS Injector: Moduler

Ich habe gerade angefangen, an eckigen js zu arbeiten. Es zeigt einen Fehler an, der unten erwähnt wird. Es funktioniert gut, wenn der Js-Code innerhalb der HTML-Seite selbst gesetzt wird, indem man das Script-Tag verwendet, aber wenn es in eine externe Javascript-Datei eingefügt wird, wird unten ein Fehler angezeigt. Kann mir jemand helfen? Ich habe den Code hier eingefügt. Ich verwende AngularJS ein v1.5.7Angular JS Injector: Moduler

Fehler:

angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module mainApp due to: 
Error: [$injector:nomod] Module 'mainApp' 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. 
http://errors.angularjs.org/1.5.7/$injector/nomod?p0=mainApp 
    at file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:68:12 
    at file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:2075:17 
    at ensure (file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:1999:38) 
    at module (file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:2073:14) 
    at file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:4608:22 
    at forEach (file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:321:20) 
    at loadModules (file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:4592:5) 
    at createInjector (file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:4514:19) 
    at doBootstrap (file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:1751:20) 
    at bootstrap (file:///D:/Tutorials/AnjularjS/Controllers/lib/angular.js:1772:12) 
http://errors.angularjs.org/1.5.7/$injector/modulerr?p0=mainApp&p1=Error%3A…FD%3A%2FTutorials%2FAnjularjS%2FControllers%2Flib%2Fangular.js%3A1772%3A12)(anonymous function) @ angular.js:68(anonymous function) @ angular.js:4631forEach @ angular.js:321loadModules @ angular.js:4592createInjector @ angular.js:4514doBootstrap @ angular.js:1751bootstrap @ angular.js:1772angularInit @ angular.js:1657(anonymous function) @ angular.js:31468trigger @ angular.js:3198defaultHandlerWrapper @ angular.js:3488eventHandler @ angular.js:3476

HTML TEIL:

<html> 
    <meta charset="UTF-8"> 
    <head> 
     <title>Angular JS Controller</title> 

     <script src = "lib/angular.js"></script> 
    </head> 

    <body> 
     <h2>AngularJS Sample Application</h2> 

     <div ng-app="mainApp" ng-controller="studentController"> 
     Enter first name: <input type = "text" ng-model = "student.firstName"><br><br> 
     Enter last name: <input type = "text" ng-model = "student.lastName"><br> 
     <br> 

     You are entering: {{student.fullName()}} 
     </div> 
     <script src="js/script.js"></script> 
     <!-- 
     <script> 
     var mainApp = angular.module("mainApp", []); 

     mainApp.controller('studentController', function($scope) { 
      $scope.student = { 
       firstName: "Mahesh", 
       lastName: "Parashar", 

       fullName: function() { 
        var studentObject; 
        studentObject = $scope.student; 
        return studentObject.firstName + " " + studentObject.lastName; 
       } 
      }; 
     }); 
     </script> 
     --> 
    </body> 
</html>

Js:

function initData() 
{ 
    console.log("Entered initData:"); 
    ajsController(); 
} 
function ajsController() 
{ 

     var mainApp = angular.module("mainApp", []); 

     mainApp.controller('studentController',function($scope) { 
      $scope.student = { 
       firstName: "Mahesh", 
       lastName: "Parashar", 

       fullName:function() { 
        var studentObject; 
        studentObject = $scope.student; 
        return studentObject.firstName + " " + studentObject.lastName; 
       } 
      }; 
     }); 

}

Quelle

2016-07-02 pradeepkumar

Das Problem ist, 'ng-app' fragt nach 'mainApp' Modul vor Ihren Funktionen auf Abruf, 1. Sache, warum Sie Winkelkomponente beim Funktionsaufruf initialisieren? Wenn Sie mit diesem Ansatz bleiben möchten, dann entfernen Sie "ng-app" und verwenden Sie "Bootstrap" -Anwendung träge –

bitte pradeepkumar nicht Js Inhalt in den Funktionen zu platzieren. –

Hallo danke die Antwort es funktioniert – pradeepkumar

Erste hinzufügen app.js Datei in Ordner lib

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

app.js

var app = angular.module("mainApp", []); 

     app.controller('studentController', function($scope) { 
      $scope.student = { 
       firstName: "Mahesh", 
       lastName: "Parashar", 

       fullName: function() { 
        var studentObject; 
        studentObject = $scope.student; 
        return studentObject.firstName + " " + studentObject.lastName; 
       } 
      }; 
     });

html

<html> 
    <meta charset="UTF-8"> 
    <head> 
     <title>Angular JS Controller</title> 

     <script src="lib/angular.js"></script> 
     <script src="lib/app.js"></script> 

    </head> 

    <body> 
     <h2>AngularJS Sample Application</h2> 

     <div ng-app="mainApp" ng-controller="studentController"> 
     Enter first name: <input type = "text" ng-model = "student.firstName"><br><br> 
     Enter last name: <input type = "text" ng-model = "student.lastName"><br> 
     <br> 

     You are entering: {{student.fullName()}} 
     </div> 
</body> 
</html>

Quelle

2016-07-02 11:31:01

Hallo Vielen Dank. Das funktioniert. Ich habe sogar den my code gepostet funktionieren lassen, einfach nur den funktionsaufruf vor ng-app stellen..du antwortest hat mir geholfen den fluss zu verstehen wie es funktioniert ... wie du schon sagtest es geht eher um richtigen weg (ansatz). ..nahe drei bis vier Stunden suchten Grund dafür ... noch einmal vielen Dank :) – pradeepkumar

Danke, dass dein Code funktioniert – pradeepkumar

es hört sich gut an, dass es geklappt hat. Bitte auch abstimmen –

Sie haben Ihre Modulerstellung Code nach innen setzen die Funktion ajsController, die von initData aufgerufen wird, aber ich sehe nicht, dass Sie initData() irgendwo aufrufen?

Quelle

2016-07-02 11:00:42 daf

Hallo, danke, ich vergesse dieses Stück Code. Aber der Fehler existiert immer noch. Er erkennt mein mainApp-Modul nicht ... was es tut, wenn es in die HTML-Seite innerhalb des Skript-Tags gesetzt wird. – pradeepkumar

Hast du überprüft, ob deine 'script.js'-Datei im Ordner' js' liegt? – daf

Angular JS Injector: Moduler

Antwort

Verwandte Themen