Bài 5 ng-model trong AngularJS

Lượt xem: 4001

Xem demo

Ng-model là chỉ dẫn (directive) trong AngularJS, được sử dụng để liên kết dữ liệu giữa máy chủ (server) và máy khách (client) thông qua bộ điều khiển (controller).

Làm thế nào để định nghĩa một ng-model trong HTML?

Bạn có thể thêm ng-model chỉ dẫn vào một thẻ (tag) HTML

Ví dụ:

<input ng-model="val" class="my-input" />

Ví dụ html đầy đủ cho ng-model

 <html > 
   <head > 
     <title>Angular JS Model    </title> 
     <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
     <script > 
       angular.module('MyForm', [])  
           .controller('myController', ['$scope', function($scope) {  
       }]);  
     </script > 
     <style > 
       .my-input {  
         -webkit-transition:all linear 0.5s;  
         transition:all linear 0.5s;  
         background: transparent;  
       }  
     </style > 
   </head > 
   <body ng-app="MyForm" > 
     <form name="myForm" ng-controller="myController" > 
       <input ng-model="val" name="yourname" class="my-input" / > 
       <p>{{val}}</p>
 </form > 
</body > 
</html >

Xem thêm:Bài 6 ng-bind trong AngularJS

Xem demo