1 <html ng-app="notesApp"> 2 <head><title>Notes App</title></head> 3 <body ng-controller="MainCtrl as ctrl"> 4 <form ng-submit="ctrl.submit()" name="myForm"> 5 <input type="text" 6 name="uname" 7 ng-model="ctrl.user.username" 8 required 9 ng-minlength="4"> 10 <span ng-show="myForm.uname.$error.required"> 11 This is a required field 12 </span> 13 <span ng-show="myForm.uname.$error.minlength"> 14 Minimum length required is 4 15 </span> 16 <span ng-show="myForm.uname.$invalid"> 17 This field is invalid 18 </span> 19 <input type="password" 20 name="pwd" 21 ng-model="ctrl.user.password" 22 required> 23 <span ng-show="myForm.pwd.$error.required"> 24 This is a required field 25 </span> 26 <input type="submit" 27 value="Submit" 28 ng-disabled="myForm.$invalid"> 29 </form> 30 <script src="http://riafan.com/libs/angular.js"></script> 31 <script type="text/javascript"> 32 angular.module('notesApp', []) 33 .controller('MainCtrl', [function() { 34 var self = this; 35 self.submit = function() { 36 console.log('User clicked submit with ', self.user); 37 }; 38 }]); 39 </script> 40 </body> 41 </html>
ng-controller="MainCtrl as ctrl"，允许数据可以在同一个页面的不同的controller之间自由穿梭。。。
Create a reference to this in our controller.
angular.module('app').controller('MainCtrl', function ($scope){
var self = this;
Remove $scope from our controller dependency, and use self instead of $scope.
angular.module('app').controller('MainCtrl', function (){
var self = this;
self.message = 'hello';
self.changeMessage = function(message){
self.message = message;
};
});