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
    特别注明外均为原创,转载请注明。

    分享到微信

    扫描二维码

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

    相关文章

    发表评论:

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

    «    2025年5月    »
    1234
    567891011
    12131415161718
    19202122232425
    262728293031

    搜索

    控制面板

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

    最新留言

    文章归档

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