声明:实习总结不会写出公司核心代码,所以代码会将所有变量进行更改,如果哪里出现问题,请谅解。
思路:
后端:
首先创建PO对象。对传回来的对象,进行数据库操作。增、删、改。至于查询,则是刚进入到页面的时候便要进行查询,将数据返回到前端。所以需要两个接口,一个接口用来将查询的数据发送给页面。另一个接口需要对数据进行增删改。那么问题来了、传回来一组数据。你该如何对数据进行分类。进行增删改。我的思路是根据ID(也是数据库中插入数据的ID)。根据这个ID我们进行判断。如果进行删除,那么就将删除项的ID放进delID数组中。不需要的话,就获取PO对象,若改PO对象没有ID那么就是要创建的,则进行数据库的增加操作,如果有ID值,那么就进行更改操作。在此不进行数据的比较,直接进行更改。那么我前端传回来的数据,就不是一个PO对象,是一个VO对象。包含一个删除ID数组(String[]delID)和一个PO对象集合(List(Subject))
前端:
前端界面已经写好,只需增加一个“添加”按钮、一个保存“按钮”和一个“删除”(×)。在刚打开界面的时候,获取后台数据,在界面遍历之后输出到相应的位置。当点击“×”时,此时将该条数据的ID放进delID数据中。
当点击“保存”按钮时,将编辑页面中的所有数据返回到后台。
流程:
后端:
Controller提供对外的接口。同时调用service方法(在这里不使用ServiceImpl是因为面向接口编程的思想)。ServiceImpl重写service方法。同时调用Dao层方法。创建PO对象。由于业务需要,创建Vo对象。
前端:
HTML页面调用controller.js中的方法。controller.js调用service.js方法来进行前后交互。同时在controller.js中使用state.go来实现url和HTML界面的跳转。
实现:
后端:
①创建PO对象:
第一行的注解:@Document(collection= "fi_setting_subject");是springdata mongodb的注解。在这里我只简单的解释一下。
@Document:
标注在实体类上,类似于hibernate的entity注解,标明由mongo来维护该表。“fi_setting_subject”即为表名。subject及其父类的属性即为字段名。
org.springframework.data.mongodb.core.mapping.Document.class
把一个java类声明为mongodb的文档,可以通过collection参数指定这个类对应的文档。
@Document(collection="mongodb对应 collection名")
// 若未加 @Document,该 bean save到 mongo 的 user collection
// 若添加 @Document,则 save 到 reUser collection
@Document(collection="reUser")
publicclassUser{
}
②创建VO对象:
③创建Dao方法:
④创建Service方法。
因为BaseService中存在save方法,所以一会在实现类直接重写就好。并不需要自己定义。
⑤编写serviceImpl。
查询方法:
Queryquery.with(new Sort(Sort.Direction.Asc,”creatDate”));
这句话的意思是按照“creatDate”升序的条件进行查询。创建时间久的在前,新创建的在后面。
保存方法:
很简单的逻辑。因为传进来的是VO类,我们要讲PO类和delID拆开。放在两个数组中。然后对PO类进行逻辑判断。然后再判断delID是否为空。然后对其执行操作。
⑥创建controller。
controller中有几个注解:
@ RequiresPermissions:
shiro权限控制,只有这个权限的人才可以进行操作
@RequestBody:@RequestBody接收的是一个Json对象的字符串,而不是一个Json对象。然而在ajax请求往往传的都是Json对象,后来发现用 JSON.stringify(data)的方式就能将对象变成字符串。同时ajax请求的时候也要指定dataType:"json",contentType:"application/json" 这样就可以轻易的将一个对象或者List传到Java端,使用@RequestBody即可绑定对象或者List.
@ RequestMapping: RequestMapping是一个用来处理请求地址映射的注解,可用于类或方法上。用于类上,表示类中的所有响应请求的方法都是以该地址作为父路径。
前端:
界面一开始被前端的人只做成一个假的。我需要把它变成一个动态表格。点击添加按钮,多出来一排(一个对象)。
这里有几个函数,是我新掌握的:ng-repeat;ng-model;ng-click;track by;
被标记的地方是页面展示出的序号:
通过trackby 方法绑定,使得的序号依次增加一
“添加”按钮通过调用addSubject方法。方法写在对应的controller中。
当前页面就会去遍历subjectList数组(脏检查)。当多一个成员时,那么就会多出来一行。
当点击保存按钮时,因为前后交互的是VO对象,所以我们需要定义一个:
然后将saveData传回后台。
在service方法中利用ajax进行数据传递:
然后在后台获取到data值。
当我们刚进入到页面时,需要从后台获取数据,所以我将方法写在refresh函数中:
这样就可以在刚进入页面时,遍获取数据同时显示。
问题:
问题1:在页面点击添加按钮。确实出现一行,但是同时添加多个之后,发现新加行内的数据都一样,所以说明新加行都是一个对象。所以更改添加函数,每次调用添加函数时,创建一个新的对象。问题解决。附添加函数代码
问题2:数据显示按照数据创建时间进行排序。
既然显示的数据是后台传过来的,那么我就在查询的时候就按创建时间查询“creattime”:
Query query.with(new Sort(Sort.Direction.ASC,"createDate"));
然后调用封装好的方法,进行查询。MongoDb查询(SpringData JPA)
问题3:将数据传回后台一直失败
问题报错是:Could not readJSON: Can not deserialize instance ofcom.xx.xx.xx.xxxx.xxxxxVo out of START_ARRAY token;一开始认为是json数据格式有问题,所以读不到。结果其实也是。后来需要的是一个Vo类型数据,里面包含两个属性(String[ID],List(subject)),而我前端只是传输了一个List数据,当然不行。所以定义一个对象,和后端的Vo对象匹配。问题解决。
问题4:在删除ID的同时,也会创建一个新的数据
没有在后台没有进行逻辑判断。判断插入数据空,因为使用paostman进行数据测试。