Angular JS error : "angular.js:13708 Error: [ng:areq] "

Question

I want to create a single page called feedback.html that contains a table using Angular JS. I want to get data from a controller defined at controller.js

feedback.html

<!DOCTYPE html>
<html ng-app>
    <head lang="en">
        <meta charset="UTF-8">
        <title>Log Analysis : User feedback</title>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
    </head>
    <body ng-app="logAnalysisApp" ng-controller="logFeedbackController">
        <div class="col-md-12">
            <table class="display table">
                <thead>
                <tr><th> Log List </th></tr>
                </thead>
                <tbody>
                    <tr ng-repeat="log in logList">
                        <td>{{ log.message }}</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </body>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="../../js/app.js"></script>
    <script type="text/javascript" src="../../js/service/services.js"></script>
    <script type="text/javascript" src="../../js/controller/controller.js"></script>
</html>

controller.js

var app = angular.module('logAnalysisApp', []);
app.controller('logFeedbackController',function($scope) {
    $scope.logList = [
    {
        message : 'log number one for the test',
        server : 'testserver',
        environment : 'dev'
    },
    {
        message : 'log number two for the test',
        server : 'prdserver',
        environment : 'prd'
    }];
});

app.js

angular.module('logAnalysisApp',[
    'logFeedbackController'
])

My project has the following structure :

I get the following error message :

angular.js:13708 Error: [ng:areq] http://errors.angularjs.org/1.5.7/ng/areq?p0=logFeedbackController&p1=not%20a%20function%2C%20got%20undefined
    at Error (native)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:6:412
    at sb (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:22:508)
    at Qa (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:23:78)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:89:273
    at ag (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:72:353)
    at m (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:64:218)
    at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:58:481)
    at g (https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:58:498)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:58:119

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

make below changes

replace ng-app from <html> with ng-app="logAnalysisApp" and remove it from <body>
change in controller.js ;

remove [] << it will declare a new module instead extending the defined module in app.js

var app = angular.module('logAnalysisApp');
change in app.js

remove controller dependency

angular.module('logAnalysisApp',[])

working plunker

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Jun 30, 2016 at 8:33

xkeshav

54.2k47 gold badges183 silver badges255 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Aissa El Ouafi Over a year ago

It work, but I get {{ log.message }} it does not replace by the values defined in the controller

xkeshav Over a year ago

see it's working; I have added working plunker. added script before <body>

Aissa El Ouafi Over a year ago

Let us continue this discussion in chat.

Kalu Singh Rao · Accepted Answer · 2016-06-30 09:00:37Z

<!DOCTYPE html>
<html ng-app="logAnalysisApp">

<head lang="en">
  <meta charset="UTF-8">
  <title>Log Analysis : User feedback</title>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
</head>

<body ng-controller="logFeedbackController">
  <div class="col-md-12">
    <table class="display table">
      <thead>
        <tr>
          <th>Log List</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="log in logList.message">
          <td>{{ log }}</td>
        </tr>
      </tbody>
    </table>
  </div>
</body>


<script>
  var app = angular.module('logAnalysisApp', []);
  app.controller('logFeedbackController', function($scope) {
    $scope.logList = {
      message: ['log number one for the test', 'log number two for the test'],
      server: ['testserver', 'prdserver'],
      environment: ['dev', 'prd']
    };

  });
</script>

</html>

Collectives™ on Stack Overflow

Angular JS error : "angular.js:13708 Error: [ng:areq] "

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related