AngularJS error: [ng:areq] Argument 'TestController' is not a function, got undefined

Question

I'm trying to make my first controller and getting this error:

Error: [ng:areq] Argument 'TestController' is not a function, got undefined

I've simplified my code to find the error but no luck. It looks to my like I'm creating the controller and the books array in the script and referencing the controller letter by letter in the div. What am I missing?

<!doctype html>
<html data-ng-app>
<head>
    <meta charset="utf-8"/>
</head>
<body>

    <div data-ng-controller="TestController">
        <ul>
            <li data-ng-repeat="b in books">{{ b.title + ' by ' + b.author }}</li>
        </ul>
    </div>

    <script src="angular.js"></script>
    <script>
        function TestController() {
            this.books = [{title: 'Angela', author: 'Donald Duck'}, {title: 'Angles', author: 'Dirty Harry'}];
        }
    </script>
</body>
</html>

I'm following a tutorial and as JB Nizet points out my knowledge is "out of date". I found that it stopped working after the first half of the 1.3.0-betas. — J. Doe
– J. Doe, Commented Mar 24, 2016 at 17:36

JB Nizet · Accepted Answer · 2016-03-24 17:06:55Z

1

It's been a very long time since global functions aren't controllers anymore in angular.js. You need to register the function as a controller in your module:

<html ng-app="myApp">

and in the JS code:

angular.module("myApp", []).controller('TestController', function($scope) {
    $scope.books = ...;
});

Your angular knowledge is out-of-date. re-read the documentation.

answered Mar 24, 2016 at 17:06

JB Nizet

694k94 gold badges1.3k silver badges1.3k bronze badges

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

Comments

shreyansh · Accepted Answer · 2016-03-24 17:12:09Z

0

or the more simplified way

angular.module("myApp", []).controller('TestController', TestController);

function TestController($scope) {
$scope.books= [{title: 'Angela', author: 'Donald Duck'}, {title: 'Angles', author: 'Dirty Harry'}];

}

answered Mar 24, 2016 at 17:12

shreyansh

1,6875 gold badges30 silver badges49 bronze badges

Collectives™ on Stack Overflow

AngularJS error: [ng:areq] Argument 'TestController' is not a function, got undefined

2 Answers 2

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Linked

Related