品优购商城项目（二）AngularJS、自动代码生成器、select2下拉多选框

品优购商城想项目第二阶段 AngularJS、自动代码生成器、select2下拉多选框

完成了课程第三天、第四天的的任务。

1、学习了AngularJs前端的mvc分层思想，js部分分成controller和service层，并且可以继承，调用。代码层次非常清晰。

2、掌握了 自动代码生成工具HeimaCodeUtil_V2.4_32 可以选择生成多种结构的代码，对于简单的后台增删改查足够用了。使用该工具首先测试数据库连接，然后再选择数据库进入页面，选择生成类型。最后把生成的文件copy到项目中调用即可。

再此对培训机构有了一个正确的认识，特别是黑马，非常牛皮。这个代码自动生成器就是他们的杰作，这里不再展示因为是别人的版权。

3、在逆向工程生成的代码中，处理多表关联的业务思想是：把关联的表生成一个组合类，即组合类包含关联的类。在业务层使用Criteria关联操作。注意生成的组合类也必须实现序列化，实体类同是如此，否则报错。

4、接触了新的前端控件select2，可以实现下拉框多选，并且双向数据绑定。这让我想到layui框架select无法绑定change事件，是我不会用还是根本不支持，待验证。select2需要引用相应的文件

<linkrel="stylesheet"href="../plugins/select2/select2.css"/>

<linkrel="stylesheet"href="../plugins/select2/select2-bootstrap.css"/>

<scriptsrc="../plugins/select2/select2.min.js"type="text/javascript"></script>

<scripttype="text/javascript"src="../js/angular-select2.js"></script>

select2使用

<input select2 select2-model="entity.brandIds"  config="brandList" multiple placeholder=" 选择品牌（可多选） " class="form-control">

multiple 表示可多选

Config用于配置数据来源

select2-model用于指定用户选择后提交的变量

下面是select2相关的技术资料地址，有时间去研究。

=================
## 不再维护了，仅做存档

angularjs封装的select2（支持任意版本的select2）

* 支持动态ng-model
* 支持select标签
* 支持自定义配置及多选（与select2原生的配置方式一致）
* 支持ajax
* 支持自定义内置配置

具体使用请下载源码，打开index.html查看。
![demo页面](http://think2011.qiniudn.com/angularjs-select2.png)

---
> ##### 技术： angularjs + jquery + select2
> ##### 时间： 2014年5月
> ##### 博客： [think2011](http://think2011.github.io)
> ##### 源码： [select2](http://ivaynberg.github.io/select2/)
> ##### 源码： [angularjs-select2（当前页面就是）](https://github.com/think2011/angularjs-select2.git)