[AngularJS] problème de $scope

seb2913
Javascript

Bonjour à tous,

Je débute sur AngularJS et je suis le tutoriel du site pour m'exercer et j'ai un problème avec le $scope pour afficher dans ma vue.

J'ai inspecter au niveau de la console et regarder l'erreur sur le site :

Argument 'CommentsCtrl' is not a function, got undefined

Je ne vois pas trouve pourquoi il y'a un soucis avec la fonction car en regardant sur la video , j'ai pareil ou alors je ne vois pas l'erreur si quelqu'un peut m'aider cela serait cool, voici mon code :

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body ng-app>
    <input type="text" ng-model="query"/>
    <select ng-model="order">
      <option value="username"> Organiser par nom</option>
      <option value="content"> Organiser par contenu</option>

    </select>
    <div ng-controller="CommentsCtrl">
      <div ng-repeat="comment in comments | filter:{username:query} | orderBy:order">
        <p><strong>{{comment.username}}</strong><br>
        {{comment.content}}
        </p>
      </div>
    </div>

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
    <script>
      function CommentsCtrl($scope){
        $scope.comments = [{username:'Jean', content:'test1'},{username:'John', content:'test2'}];
      }
    </script>
  </body>
</html>

Merci d'avance

2 réponses

MacFly
Réponse acceptée

Bonjour,

Declarer la fonction faisant office de controlleur ne suffit pas.
Il faut aussi enregistrer le controlleur au niveau du module.

Si le module n'existe pas voila la syntaxe:

angular.module('appName', []).controller('CommentsCtrl', CommentsCtrl);

Si il existe:

angular.module('appName').controller('CommentsCtrl', CommentsCtrl);

Je ne vois pas non plus le bootstrap d'angular dans votre code.

Vous pouvez ajouter ng-app="appName" sur un element html. Sinon vous pouvez utiliser la méthode angular.bootstrap 

angular.bootstrap(document, ['appName']);
seb2913
Auteur

D'accord , j'avais déjà observé un peu AngularJS auparavant et avait entendu parlé de cette notion de module mais là le tutoriel du site que je suis sur YouTube , le code est fonctionnel malgrés que ce que vous indiqué au-dessus n'est pas présent. Je vais suivre vos conseils pour rendre cela fonctionnel.