CODEWITHSUNDEEP
angularjsangularjs-directiveangularjs-scopeangularjs-ng-repeat
Yasser Moussa
Yasser Moussa

Reputation: 2329

Angularjs undefined function Error: ng:areq Bad Argument

I am taking baby steps learning angularjs from video tutorial and as i reached the controllers section i had this error:

Argument 'SimpleController' is not a function, got undefined

although i followed the steps carefully.Please bare in mind that this is all i know about angularjs so far.

<!DOCTYPE html>
<html data-ng-app="">
    <head></head>

    <body>
        <div data-ng-controller="SimpleController">
            <input type="text" data-ng-model="name" id=""> {{ name }}

            <br>

            <h3>Looping with the ng-repeat Directive</h3>

            <ul>
                <li data-ng-repeat="cutomer in customers | filter:name | orderBy:'city'">{{ cutomer.name | uppercase }} - {{ cutomer.city | lowercase }}</li>
            </ul>
        </div>

        <script src="angular.min.js"></script>
        <script>
            function SimpleController($scope) {
                $scope.customers = [
                    {name:'Yasser Moussa',city:'Alexandria'},
                    {name:'Ahmed Salah',city:'Al Riyadh'},
                    {name:'Khaled Medhat',city:'Alexandria'},
                    {name:'Ali Dawood',city:'Cairo'}
                ];
            }
        </script>
    </body>
</html>

Upvotes: 1

Views: 182

Answers (1)

Alex
Alex

Reputation: 842

  1. Create a module, called "app"
  2. Assign the control to that module using angular.module("app", []).controller("SimpleController, function() {})
  3. Declare the module in your html using data-ng-app="app"

Here is a plunker

Upvotes: 1

Related Questions