网络获取数据

最新推荐文章于 2023-08-26 14:45:00 发布

来自北方的实际过往

最新推荐文章于 2023-08-26 14:45:00 发布

阅读量296

点赞数

本文链接：https://blog.csdn.net/guohui151/article/details/79100545

版权

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title></title>
<style>
label {
display: block;
}
</style>
<script type="text/javascript" src="js/angular.min.js"></script>
<script>
var app = angular.module("myapp", []);
app.controller("democ", function($scope, $http) {
$scope.add_sex = '男'; //默认选中
//get获取字符串解析
$http.get("http://result.eolinker.com/TucCTQueffdc1d1aaa3be05d8c62e9bb5d3e8b495f97cca?uri=hybrid")
.then(function(d) {
$scope.stus = d.data; //json串根据键获取值对象.键名
});
//用方法获取年龄(系统当前时间-出生时间)
$scope.getAge = function(bir) {
var b = new Date(bir).getYear(); //出生年份
var newb = new Date().getYear();
return newb - b;
}
//全/选
$scope.ckall = function() {
for(var i = 0; i < $scope.stus.length; i++) {
$scope.stus[i].ck = $scope.flag;
}
}
//批量删除
$scope.dels = function() {
for(var i = 0; i < $scope.stus.length; i++) {
//判断当前行是否被勾选,如果勾选则进行删除操作
if($scope.stus[i].ck) {
//删除完毕后,下个对象自动移动到当前索引
$scope.stus.splice(i, 1);
i--;
}
}
}
//全部删除
$scope.delall = function($index) {
$scope.stus.splice($index);
}
//点击单行按钮删除
$scope.del = function(index) {
var c = confirm("确定删除吗？");
if(c == true) {
$scope.stus.splice(index, 1);
}
}
//插入部门查询
$scope.getDname = function(dname) {
if($scope.select == undefined || $scope.select == "") {
return true;
}
//indexOf查找一个字符串
if(dname.indexOf($scope.select) > -1) {
return true;
}
return false;
}
//添加判断
$scope.save = function() {
//存放错误提示信息的数组
$scope.errors = [];
//判断姓名
if($scope.add_name == undefined || $scope.add_name == "") {
$scope.val_name = true;
$scope.errors.push(1);
} else {
$scope.val_name = false;
}
//判断年龄
if($scope.add_age == undefined || $scope.add_age == "" || $scope.add_age < 0) {
$scope.val_age = true;
$scope.errors.push(1);
} else {
$scope.val_age = false;
}
//判断薪资
if($scope.add_salary == undefined || $scope.add_salary == "") {
$scope.val_salary = true;
$scope.errors.push(1);

} else {
$scope.val_salary = false;
}
//出生日期
if($scope.add_date == undefined || $scope.add_date == "") {
$scope.val_date = true;
$scope.errors.push(1);

} else {
$scope.val_date = false;
}
//判断部门
var obj_d;
if($scope.add_job == undefined || $scope.add_job == "") {
$scope.errors.push(4);
} else {
if($scope.add_job=="市场部"){
obj_d={id:1,name:$scope.add_job};
}else if($scope.add_job=="研发部"){
obj_d={id:2,name:$scope.add_job};
}
}

if($scope.errors.length == 0) {
$scope.stus.push({
"salary": $scope.add_salary,
"birthday": $scope.add_date.valueOf(), //获取date日期的毫秒数
"department": obj_d,
"gender": $scope.add_sex,
"id": $scope.stus.length + 100,
"name": $scope.add_name
});
console.log($scope.stus);

}
}

})
</script>
</head>

<body ng-app="myapp" ng-controller="democ">
<input style="border-radius:50px ;" type="text" placeholder="姓名模糊查询" ng-model="xmcx" />
<input style="border-radius:50px ;" type="text" placeholder="部门模糊查询" ng-model="select" />
<select ng-model="px">
<option>根据薪资排序</option>
<option value="+salary">升序</option>
<option value="-salary">降序</option>

</select>
<button ng-click="dels()">批量删除</button>
<button ng-click="delall($index)">清空购物车</button>

<h1 ng-show="stus.length==0">
购物车为空，继续添加
</h1>

<div ng-show="stus.length>0">
<table style="width: 600px;" border="1" cellspacing="0">
<tr>

<td><input type="checkbox" ng-click="ckall()" ng-model="flag" /></td>
<td>员工姓名</td>
<td>员工年龄</td>
<td>员工性别</td>
<td>员工薪资</td>
<td>出生日期</td>
<td>部门名称</td>
<td>操作</td>
</tr>

<tr ng-repeat="s in stus|orderBy:px|filter:{name:xmcx}" ng-show="getDname(s.department.name)">
<td><input type="checkbox" ng-model="s.ck" /></td>
<td>{{s.name}}</td>
<td>{{getAge(s.birthday)}}</td>
<td>{{s.gender}}</td>
<td>{{s.salary|currency:'￥'}}</td>
<td>{{s.birthday|date:"yyyy-MM-dd hh:mm:ss"}}</td>
<td>{{s.department.name}}</td>
<td>
<button ng-click="del($index)">删除</button>
<button ng-click="upd()">修改</button>
</td>
</tr>
</table>
</div>

<button ng-click="showadd=true">添加</button>
<div ng-show="showadd">
<label>
员工姓名：<input type="text" placeholder="请输入姓名" ng-model="add_name" /><span ng-show="val_name">姓名不合法</span>
</label>
<label>
员工年龄：<input type="number" placeholder="请输入年龄" ng-model="add_age" /><span ng-show="val_age">年龄不合法</span>
</label>
<label>
员工性别：<input type="radio" name="sex" ng-model="add_sex" value="男" />男
<input type="radio" name="sex" ng-model="add_sex" value="女" />女
</label>
<label>
员工薪资：<input type="number" placeholder="请输入薪资" ng-model="add_salary" /><span ng-show="val_salary">薪资不合法</span>
</label>
<label>
出生日期：<input type="date" placeholder="请输入出生日期" ng-model="add_date" /><span ng-show="val_date">生日不合法</span>
</label>
<label>
<select ng-model="add_job">
<option value="">--选择部门--</option>
<option>市场部</option>
<option>研发部</option>
</select>
<span ng-show="val_job">部门不合法</span>
</label>
<button ng-click="save()">保存</button>

</body>

</html>

来自北方的实际过往

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
网络获取数据

label { display: block; } var app = angular.module("myapp", []); app.controller("democ", function($scope, $http) { $scope.add_sex = '男'; //默认选中 //get获取字符串解析 $http.get("http://r
复制链接

扫一扫