AngularJS - Controller As Syntax
HTML
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css">
<script src="http://code.angularjs.org/1.1.5/angular.js"></script>
<div ng-app="myapp">
<div ng-controller="PersonCtrl as person">
<p>{{ person.name['last'] }}</p>
</div>
<div ng-controller="PersonCtrl2 as person2">
Change name <button type="button" ng-click="person2.changeName()"> To Ted</button>
</div>
</div>
JavaScript
var myapp = angular.module('myapp', []);
myapp.controller('PersonCtrl', function (myService1) {
this.name = myService1.newName;
});
myapp.service('myService1', function() {
return {newName :{'last': 'Bob'}};
});
var PersonCtrl2 = function(myService1) {
this.service = myService1;
};
PersonCtrl2.prototype.changeName = function() {
alert('a');
this.service.newName.last='Ted';
};
myapp.controller('PersonCtrl2', PersonCtrl2);