web-dev-qa-db-fra.com

Erreur non capturée: [$ injector: modulerr] Impossible d'instancier l'erreur du module sur l'application Angular.js sous Apache

J'utilise un serveur Apache pour héberger une application angulaire. .__ Ceci est l'index.html:

<html>
  <head>
    <script src="/lib/angular/angular.js">
  </head>
  <script>
     myapp = angular.module('myapp', []);

     myapp.controller('indexCtrl', function($scope){

          $scope.words = ['It','is','what','it','is']
     });

  </script>

  <body ng-app="myapp">

      <div ng-controller="indexCtrl">
        <div ng-repeat="Word in words">
          {{Word}}
        </div>
      </div>

  </body>
</html>

Lorsque je frappe le code HTML du navigateur, il affiche une page vierge avec cette erreur:

Erreur non capturée: [$ injector: modulerr] Échec d'instanciation du module myapp en raison de: Erreur: [$ injector: nomod] Le module 'myapp' n'est pas disponible! 

Vous avez mal orthographié le nom du module ou vous avez oublié de le charger. Si vous enregistrez un module, assurez-vous de spécifier les dépendances comme second argument.

Quel pourrait être le problème?

angularjsangularjs-ng-repeat
8
moaglee

L'erreur est due à des valeurs en double dans un tableau. J'ai ajouté track by $index à l'intérieur de ng-repeat pour résoudre ce problème.

DOCS: ng-repeat

Code modifié:

<html>
  <head>
    <script src="/lib/angular/angular.js"></script>
  </head>
  <script>
     var myapp = angular.module('myapp', []);

     myapp.controller('indexCtrl', function($scope){

          $scope.words = ['It','is','what','it','is']
     });

  </script>

  <body ng-app="myapp">

      <div ng-controller="indexCtrl">

          <div ng-repeat="Word in words track by $index">

             {{Word}}

          </div>
      </div>

  </body>
</html>
9
Ved

S'il vous plaît inclure angularjs dans le corps.

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

Inclure cette ligne dans le corps. J'espère que ça va marcher!

1
Lalit Sachdeva

Mettez la partie <script> et la fin du corps:

<body ng-app="myapp">

      <div ng-controller="indexCtrl">
        <div ng-repeat="Word in words">
          {{Word}}
        </div>
      </div>
      <script>
          myapp = angular.module('myapp', []);
          myapp.controller('indexCtrl', function($scope){
               $scope.words = ['It','is','what','it','is']
          });
    </script>
  </body>

c’est une bonne pratique en HTML, et en particulier dans Angular, de mettre la définition de votre fichier JS juste avant la fin du corps.

0
vincent