angularJs--1入门小例子

最新推荐文章于 2024-05-03 16:12:22 发布

iteye_16498

最新推荐文章于 2024-05-03 16:12:22 发布

阅读量102

点赞数

分类专栏： angularJs 文章标签： java javascript ViewUI

本文链接：https://blog.csdn.net/iteye_16498/article/details/82635653

版权

angularJs 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<html ng-app>
<head>
<script type="text/javascript"
	src="/angularJs/angular-1.2.19/angular.min.js"></script>
</head>
<body>
	<div ng-controller="testCtrl">
		<b>小型计算器:</b> <br> <br>
		<table>
			<tr>
				<td>数字1</td>
				<td>数字2</td>
			</tr>
			<tr>
				<td><input type="number" 
				           min="0" 
				           max="10" 
				           ng-model="number1"
					       required></td>
				<td><input type="number" 
				           min="2" 
				           max="10" 
				           ng-model="number2"
					       required></td>
			</tr>
		</table>
		<hr>
		<b>Total:</b> {{number1 * number2 | currency}}
	</div>
   <div ng-controller="registUser">
       <b>注册用户：</b><br><br>
       <table>
			<tr>
				<td>用户名:</td>
				<td><input type="text" ng-model="userName"></td>
			</tr>
			<tr>
				<td>密码:</td>
				<td><input type="password" ng-model="password"></td>
			</tr>
		</table>
   </div>
   <script>
            function testCtrl($scope) {
                $scope.number1 = 2;
                $scope.number2 = 5.6;
            }
            function registUser($scope){
            	$scope.userName = "chenchaoyang";
            	$scope.password="china";
            }
   </script>
</body>
</html>