After experimenting with some basic tutorials in AngularJS, I came across a discrepancy in how controllers are declared and used. For instance, in this JSFiddle link - http://jsfiddle.net/dakra/U3pVM/ - the controller is defined as a function name, which works fine for version 1.0.3 of Angular. However, I am using version 1.3.15 and this method does not work for me.
<html ng-app="myapp">
Exploring AngularJS data binding.
<div data-ng-controller="SimpleController">
Name :
<br/>
<input type="text" ng-model="name"/>{{name |uppercase}}
<div>
<ul>
<li ng-repeat="personName in names">{{personName}}</li>
</ul>
</div>
</div>
<script src="node_modules/angular/angular.min.js"></script>
<script>
function SimpleController($scope) {
$scope.names =['test1','test2','new'];
}
The code above throws an error stating that SimpleController is an undefined function.
However, when I replace the above function with the following code snippet, it works perfectly:
var app = angular.module('myApp', []);
app.controller('SimpleController', function($scope) {
$scope.names = ['test1','test2'];
});
Thank you,