博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
AngularJs之ng-repeat的用法
阅读量:4931 次
发布时间:2019-06-11

本文共 5506 字,大约阅读时间需要 18 分钟。

可参考文章:

ng-repeat信息展示的核心:

【1】异步读取数据源 works,见代码一

【2】使用AngularJs控件绑定数据源,见代码三

ng-repeat="work in works "
ng-model="work.company"
ng-model="work.workplace"

【3】保存修改数据,在循环体内,可以将单条记录做形参传递给方法,从而实现保存,见代码二

ng-click="saveWork(work);"
代码一  1 //查看员工背景资料 2         $http({ 3             method : 'POST', 4             url : '/omss/viewEmpBackgroudById?id='+id 5         }).success(function(data, status, headers, config) { 6             $scope.status = status; 7             if (data.length != 0) { 8                 $scope.employeeBg = (data[0]); 9                 console.log("员工背景data:"+JSON.stringify(data))10                 //获取页面中下拉框的数据源11                 /*$scope.types =[12                       {name:'正式员工',id:'1', xorder:'1'},13                       {name:'劳务工', id:'22',xorder:'2'},14                       {name:'实习生', id:'23',xorder:'3'}          15                     ];*/  16                 //性别17                 $scope.genders =[18                       {TITLE:'男',ID:'1', xorder:'1'},19                       {TITLE:'女', ID:'2',xorder:'2'}          20                     ];21                 $scope.selectedbggender=(data[0]).bggender;        22                 //循环多个工作经历23                 $scope.works=(data[0]).workList; //读取数据源24                 $scope.edus=(data[0]).eduList;    25                 $scope.familys=(data[0]).familyList;        26             }27         }).error(function(data, status, headers, config) {28             $scope.data = data || "Request failed";29             $scope.status = status;30             $scope.tips = '对不起,您的网络情况不太稳定。';31         });
代码二  1          2          3         /* 保存员工工作经历         4         */ 5         $scope.saveWork = function(work) { 6             console.log("进入saveWork........."); 7                 var postJson = { 8                     'id':work.id,//传递过来的work本来就带有的属性,只是页面未展示 9                     'sid':work.sid,//传递过来的work本来就带有,只是页面未展示10                     'workbegindate':work.workbegindate,11                     'workenddate':work.workenddate,12                     'company':work.company,13                     'job':work.job,14                     'workplace':work.workplace,15                     'tel':work.tel,16                     'isout':work.isout,17                     'remark':work.remark,                    18                 };19                 $http({20                     method : 'POST',21                     url : '/omss/saveWork',22                     data : JSON.stringify(postJson)23                 }).success(function(data, status, headers, config) {24                     $scope.status = status;25                     console.log(data);26                     alert("保存成功");27                 }).error(function(data, status, headers, config) {28                     $scope.data = data || "Request failed";29                     $scope.status = status;30                     $scope.tips = '对不起,您的网络情况不太稳定。';31                 });32                 33         };34

 

代码三   1                
2
3
4
5 6 7 8
9 10 11
12
13

工作经历

14 15
16
//重点在这里 works循环展示 17
18
工作经历{
{$index + 1}}
19
27
28
29
30
31
32
33
80
81
82
112
113
114
115
116
117
118
 
 

转载于:https://www.cnblogs.com/abc8023/p/4864223.html

你可能感兴趣的文章
sp1.3-1.4 Neural Networks and Deep Learning
查看>>
JavaScript易错知识点整理
查看>>
Biological Clocks
查看>>
2018-10-11
查看>>
国内NLP的那些人那些会
查看>>
Python随心记--函数之面向对象
查看>>
git上传文件夹报错: ! [rejected] master -> master (fetch first) error: failed to push some refs to 'h...
查看>>
uwp如何建立任何形状的头像,如圆形,方形,六边形等
查看>>
Python之禅与八荣八耻
查看>>
[正能量系列]失业的程序员(三)
查看>>
Windows下Tesseract4.0识别与中文手写字体训练
查看>>
特征工程 —— 特征重要性排序(Random Forest)
查看>>
命名 —— 函数的命名
查看>>
常见矩阵求导
查看>>
Node.js第三天
查看>>
Windows Azure 90天Free Trial (不含教程),已经可以支持中文简体与中文繁体了
查看>>
清空浏览器缓存
查看>>
Unity学习疑问记录之向量基础
查看>>
linux -- 嵌入式2.6.37wifi-vnt6656移植驱动
查看>>
ubuntu -- mf210v拨号流程
查看>>