Angularjs CURD
前言
基于一个手机端的项目使用了angularjs,硬着头皮去用,有很多的疑问还需要一一去验证,刚开始总是感觉找不到北,总是感觉有很多概念,而且似乎ng既夹杂MVC又夹杂MVVM的思想, 忙里偷闲敲了个简单的CURD demo。 当然顺着这个demo还可以延伸很多知识点,比如: 带分页查询、连接后台数据库、调用WebApi、分层使用Servcice、Factory。
效果图
<script type="text/javascript">
var app=angular.module('myApp',[]);
app.controller('empCtrl',function($scope){
$scope.emparr=[]; //添加
$scope.btnclk=function(){
$scope.emparr.push({'arr_id':$scope.id,'arr_name':$scope.name,'arr_desg':$scope.desg});
$scope.id='';
$scope.name='';
$scope.desg='';
}
var key='';
//编辑
$scope.edit=function(emp,indx){
key=indx;
console.log(indx);
console.log(emp);
$scope.id=emp.arr_id;
$scope.name=emp.arr_name;
$scope.desg=emp.arr_desg;
}
//修改
$scope.btnupd=function(id,name,desg){
$scope.emparr[key].arr_id=id;
$scope.emparr[key].arr_name=name;
$scope.emparr[key].arr_desg=desg; $scope.id='';
$scope.name='';
$scope.desg='';
} $scope.del=function(id){
$scope.emparr.splice(id,1);
}
});
</script>
Angularjs CURD的更多相关文章
- [angularjs] MVC + Web API + AngularJs 搭建简单的 CURD 框架
MVC + Web API + AngularJs 搭建简单的 CURD 框架 GitHub 地址:https://github.com/liqingwen2015/Wen.MvcSinglePage ...
- angularjs和ajax的结合使用 (二)
今天我们来继续丰富上次的例子.我们来搞些 稍微复杂点的应用. 首先我们来加一个全选 的功能. 上一篇的例子里我们看到 分页时载入的是我们通过linq 查询自定义列 然后构建的匿名类 .使用这种EF框架 ...
- AngularJS之初级Route【一】(六)
前言 这一节我们来讲讲AngularJS中的路由以及利用AngularJS在WebAPi中进行CRUD.下面我们一起来看看. 话题 当我们需要进行路由映射时即用到$route服务,在AngularJS ...
- [后端人员耍前端系列]AngularJs篇:30分钟快速掌握AngularJs
一.前言 对于前端系列,自然少不了AngularJs的介绍了.在前面文章中,我们介绍了如何使用KnockoutJs来打造一个单页面程序,后面一篇文章将介绍如何使用AngularJs的开发一个单页面应用 ...
- 精通AngularJS 读书笔记(1)
邂逅AngularJS AngularJS是采用JavaScript语言编写的客户端MVC框架,帮助开发者编写现代化的单页面应用.尤其适合编写有大量CURD操作的,具有AJAX风格的富客户端应用. 使 ...
- 30分钟快速掌握AngularJs
[后端人员耍前端系列]AngularJs篇:30分钟快速掌握AngularJs 一.前言 对于前端系列,自然少不了AngularJs的介绍了.在前面文章中,我们介绍了如何使用KnockoutJs来 ...
- 学习笔记-AngularJs(七)
在学习笔记-AngularJs(六)提及了事件处理器和过滤器以及它们的例子,而我们知道之前我是使用$http服务去获得我们需要的json数据,但是$http是比较底层的用法,有时候我们想把获取json ...
- AngularJs快速上手掌握
一.前言 对于前端系列,自然少不了AngularJs的介绍了.在前面文章中,我们介绍了如何使用KnockoutJs来打造一个单页面程序,后面一篇文章将介绍如何使用AngularJs的开发一个单页面应用 ...
- 通过AngularJS实现前端与后台的数据对接(二)——服务(service,$http)篇
什么是服务? 服务提供了一种能在应用的整个生命周期内保持数据的方法,它能够在控制器之间进行通信,并且能保证数据的一致性. 服务是一个单例对象,在每个应用中只会被实例化一次(被$injector实例化) ...
随机推荐
- DataTable扩展方法ToList<T>()、ToJSON()、ToArrayList()
/// <summary> /// 扩展方法类 /// </summary> public static class CommonExtension { /// <sum ...
- 跟服务器交互的登录Demo
服务器写死 账号密码,演示登录 服务器代码: 开发工具MyEclipse public class LoginServlet extends HttpServlet { /** * The doGet ...
- IOS第一天-新浪微博 - 框架的搭建
*************HWAppDelegate.m - (BOOL)application:(UIApplication *)application didFinishLaunchingWith ...
- VS快捷键总结(包括ReSharper)
Shift+Alt+Enter 全屏显示代码Ctrl+E 最近文件列表Ctrl+B 转到定义Ctrl+Alt+B 转到继承类或接口处Ctrl+U 转到基类Ctrl+D 复制当前行或选定的块(Dupli ...
- Hadoop学习笔记—1.基本介绍与环境配置
一.Hadoop的发展历史 说到Hadoop的起源,不得不说到一个传奇的IT公司—全球IT技术的引领者Google.Google(自称)为云计算概念的提出者,在自身多年的搜索引擎业务中构建了突破性的G ...
- Alljoyn瘦客户端库介绍(官方文档翻译)
Alljoyn瘦客户端库介绍(上) 1.简介 本文档对AllJoynTM瘦客户端的核心库文件(AJTCL)进行了详尽的介绍.本文档介绍了系统整体架构,AllJoyn框架结构,并着重于介绍如何将嵌入式设 ...
- promise实现原理
先看的这篇有问题的文章 花了很长时间研究这篇文章,卡在实现串行Promise那儿了,一直看不明白.就在刚才,发现这篇文章是错的,在第一次用setTimeout( ,0)那儿就错了.虽然用setTime ...
- Spring4.X——搭建
一,Spring概念总结 spring是一个集成了许多第三方框架的大杂烩,其核心技术是IOC(控制反转,也称依赖注入)和AOP(面向切面编程),所以spring既是一个IOC容器,也是一个AOP框架. ...
- Spark算子选择策略
摘要 1.使用reduceByKey/aggregateByKey替代groupByKey 2.使用mapPartitions替代普通map 3.使用foreachPartitions替代forea ...
- ElasticSearch ik分词安装
1.下载对应版本的ES ik分词 https://github.com/medcl/elasticsearch-analysis-ik/releases 2.解压elasticsearch-analy ...