angularJs的计算使用

104 阅读1分钟
<!DOCTYPE html>
<html>
 <head>
 	<meta charset="utf-8">
 	<title></title>
 	<style>
 		input{
 			width: 50px;
 		}
 	</style>
 </head>
 <body ng-app="myApp">
 	<!--
 	* ng-app: 创建一个模块,监管整个页面
 	* ng-model:双向数据绑定 
 	* ng-init: 初始化数据
 	* ng-click: 
 	* ng-controller: 
 	* ng-bind: 
 	* ng-repeat: 
 	  
 	* ng-show: 
 	* ng-hide: 
 	-->
 	<div ng-controller="z1" ng-init="age=18">
 		<input type="text" ng-model="username" /><br>
 		<p>{{age}}</p>
 	</div>
 	<div ng-controller="z2">
 		<!-- 类型为number的input是专门用来放数字的:1.有加减   2.不让你输非数字 -->
 		A:<input type="number" ng-model="one"/>&nbsp;&nbsp;&nbsp;&nbsp;
 		B:<input type="text" ng-model="two"/>&nbsp;&nbsp;&nbsp;&nbsp;
 		自动积:{{one * two}}<br>
 		手动积:
 	</div>
 	<script src="../js/angular-1.2.9.js" type="text/javascript" charset="utf-8"></script>
 	<script type='text/javascript'>
 		angular.module('myApp',[])
 			.controller('z1',['$scope', function(a){
 				a.username = '张三';
 				//TODO
 				a.age = 19;
 			}])
 			.controller('z2',['$scope', function(a){
 				a.one = 5;
 				a.two = 10;
 			}])
 	</script>
 </body>
</html>