AnglarJs 选择多选框动态求和

只是一个小练习:

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>

前端真难。。

手机扫描二维码访问

本文标题:《AnglarJs 选择多选框动态求和》作者:极四维博客
原文链接:https://cway.top/post/537.html
特别注明外均为原创,转载请注明。

分享到微信

扫描二维码

可在微信查看或分享至朋友圈。

相关文章

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

«    2024年10月    »
123456
78910111213
14151617181920
21222324252627
28293031

搜索

控制面板

您好,欢迎到访网站!
  查看权限

最新留言

文章归档

  • 订阅本站的 RSS 2.0 新闻聚合