webentwicklung-frage-antwort-db.com.de

Angularjs nicht abgefangener Fehler: [$ injector: modulerr] bei der Migration zu V1.3

Ich lerne Angular.js und kann nicht herausfinden, was mit diesem einfachen Code falsch ist. Es sieht gut aus, aber es gibt mir einen Fehler.

**Error**: Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.14/$injector/modulerr?p0=app&p1=Error%3A%20…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A17%3A381)

Und bevor ich ng-app="app" hinzufügte (ich behielt es nur als ng-app), gab es folgende Fehler. Warum das?

Error: [ng:areq] http://errors.angularjs.org/1.3.14/ng/areq?p0=Ctrl&p1=not%20a%20function%2C%20got%20undefined
    at Error (native)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:6:417
    at Sb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:19:510)
    at tb (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:20:78)
    at $get (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:75:331)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:57:65
    at s (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:7:408)
    at A (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:56:443)
    at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:299)
    at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js:51:316)

<!doctype html>
    <html ng-app="app">
      <head>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>

      </head>
      <body>
        <div ng-controller="Ctrl">
          <input ng-model="name">
          <h1>{{name}}</h1>
          <h2>{{age}}</h2>
        </div>

         <script>
          var Ctrl = function($scope)
           {
              $scope.age = 24;
           };
          </script>


      </body>
    </html>
javascriptangularjsangularjs-scopeangularjs-serviceangularjs-controller
13
Nakib

Nach AngularJS Version 1.3 ist die Deklaration der globalen Controller-Funktion deaktiviert

Sie müssen zuerst ein AngularJS-Modul erstellen und dann alle Komponenten an dieses bestimmte Modul anschließen.

CODE

function Ctrl($scope) {
    $scope.age = 24;
}

angular.module('app', [])
    .controller('Ctrl', ['$scope', Ctrl]);

Speziell für Ihren Fall gibt es ein Problem mit AngularJS 1.3.14 (das Downgrade auf 1.3.13 funktioniert gut). Obwohl ich es vorziehen würde, dass Sie verwenden gewinkelt 1.2.27 AngularJS 1.6.X, die stabilere Version und neueste Version von AngularJS.

Working Plunkr

UPDATE:

Sie können den aktuellen Code für den Arbeitsstatus verwenden, indem Sie die globale Controller-Deklaration in angular.config zulassen. Dies ist jedoch nicht der richtige Weg, um die Winkelanwendung auszuführen.

function Ctrl($scope) {
    $scope.age = 24;
}

angular.module('app', [])
    .config(['$controllerProvider',
        function ($controllerProvider) {
            $controllerProvider.allowGlobals();
        }
    ]);
15
Pankaj Parkar

Ich war selbst für einige Zeit in dieser Ausgabe gefangen. Bitte überprüfen Sie in der Reihenfolge: -

  1. Der Pfad zu Ihrem angle.js-Skript ist korrekt (unabhängig davon, ob Sie es in Ihrem HTML-Code aus einer lokalen Quelle oder als externe Ressource aufrufen).

  2. Als nächstes prüfen Sie, ob Ihre App initialisiert ist oder nicht, sobald Ihre angle.js korrekt ist.

    var app=angular.module('app',[]) // in Ihrer app.js-Datei

    <body ng-app="app"> // in deinem HTML

  3. Registrieren Sie anschließend Ihren Controller in der App und geben Sie alle erforderlichen Injektionen weiter

    app.controller('myCtrl',function(){});

  4. Rufen Sie Ihre Javascript-Datei in Ihrer HTML-Datei auf

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

7
Harkirat Saluja

Sie müssen Ihren Controller definieren

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

app.controller('Ctrl', ['$scope',function($scope) {
  $scope.age = 24;
}]);
6
Arielle Nguyen

Stellen Sie sicher, dass ng-app="app_name" define mit übereinstimmen muss 

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

<html ng-app="myApp">
<body>
  <div ng-controller="Ctrl">
      <input ng-model="name">
      <h1>{{name}}</h1>
      <h2>{{age}}</h2>
  </div>
  <script>
    var app = angular.module('myApp',[]); // same to the above define appName
    app.controller('Ctrl',function($scope){
      $scope.age=24; // initialize age by injecting scope
    });
  </script>
</body>
<html>

Für weitere Informationen besuchen Sie Hier

0
susan097