AnglarJs选择多选框动态求和

只是一个小练习:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="js/angular.min.js"></script>
		<script>
			var app = angular.module('myApp', []); //定义了一个叫 myApp 的模块
			//定义控制器
			app.controller('myController', function($scope) {
				$scope.list = [100, 192, 203, 434]; //定义数组
				$scope.selectIds=[];//选中的 ID 集合
				$scope.getsum=function($event,x){
					$scope.sum=0;
					if($event.target.checked){
						$scope.selectIds.push(x);
					}else{
					var idx = $scope.selectIds.indexOf(x);
					 $scope.selectIds.splice(idx, 1);//删除
					}
					for (var i of $scope.selectIds) {
						$scope.sum+=i;
					}
				};
			});
		</script>
	</head>
	<body ng-app="myApp" ng-controller="myController">
		<table>
			<tr ng-repeat="x in list">
				<td>{{x}}<input type="checkbox" ng-click="getsum($event,x)"></td>
			</tr>
		</table>
		集合:{{selectIds}}
		求和:{{sum}}
	</body>
</html>

前端真难。。

本文 暂无 评论

Top