Angular JS 1.3.11: Argument 'MyController' is not a function

Question

I'm new to angular and i have a question.

Im using 1.3.11 version of angular.

Ive wrote a simple html code that that using simple angular and im getting the following error:

Argument 'MyController' is not a function, got undefined in AngularJS [duplicate]

the html code is:

<!DOCTYPE html>
<html ng-app>
<head>
<meta charset="UTF-8">
<title>Angular Demo</title>
<script src="lib/angular/angular.min.js">
 </script>
</head>
<body>

<div ng-controller = "MyController">
  <h1> {{author.name}}</h1>
  <p> {{author.title + ', ' + author.company}}</p>
</div>

<script>
  function MyController($scope)
  {
    $scope.author= {
      'name' : 'Naim',
      'title' : 'MR',
      'company' : 'Naimos'
    }
  }
</script>

</body>
</html>

Thank you in advance.

Well, new in angular - try this https://docs.angularjs.org/tutorial. Your snippet is missing angular basics... tutorial should help — Radim Köhler, Jan 30 '15 at 18:45
I don't know what's the probelme but would like to say don't put space between assignment in html like here: `ng-controller = "MyController"` should be `ng-controller="MyController"` — Bhojendra Rauniyar, Jan 30 '15 at 18:45
https://docs.angularjs.org/guide/migration Migrating from 1.2 to 1.3 $controller will no longer look for controllers on window .Use angular.module('myApp', []).controller('MyController', [function() { // ... }]); — micha, Jan 30 '15 at 19:17

Radim Köhler · Accepted Answer · 2015-01-30T18:59:59.080

There is working plunker

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

  <head>
    <meta charset="UTF-8" />
    <title>Angular Demo</title>
    <script data-require="angular.js@*" data-semver="1.3.11" 
     src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.11/angular.js"
    ></script>
  </head>

  <body>
    <div ng-controller="MyController">
      <h1> {{author.name}}</h1>
      <p> {{author.title + ', ' + author.company}}</p>
    </div>
    <script>
  function MyController($scope)
  {
    $scope.author= {
      'name' : 'Naim',
      'title' : 'MR',
      'company' : 'Naimos'
    }
  }
  angular
    .module('app', [])
    .controller("MyController", MyController)
    </script>
  </body>

</html>

Check the definition of the angular module:

  angular
    .module('app', [])
    .controller("MyController", MyController)

And also, the module "app" is now injected int html

<html ng-app="app">

Check it in action here

No need to use module() as OP is using ng-controller and OP's code should also work fine.. — Bhojendra Rauniyar, Jan 30 '15 at 18:51
@BhojendraNepal not true with angular 1.3 https://docs.angularjs.org/guide/migration — corn3lius, Jan 30 '15 at 18:55

corn3lius · Answer 2 · 2015-01-30T18:56:59.930

works on SO?!

this is referencing 1.2

follow the migration example to get ti working with 1.3

https://docs.angularjs.org/guide/migration

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html ng-app>
<head>
<meta charset="UTF-8">
<title>Angular Demo</title>
<script src="lib/angular/angular.min.js">
 </script>
</head>
<body>

<div ng-controller = "MyController">
  <h1> {{author.name}}</h1>
  <p> {{author.title + ', ' + author.company}}</p>
</div>

<script>
  function MyController($scope)
  {
    $scope.author= {
      'name' : 'Naim',
      'title' : 'MR',
      'company' : 'Naimos'
    }
  }
</script>

</body>
</html>

Angular JS 1.3.11: Argument 'MyController' is not a function

2 Answers2

Linked