angularJs实现增删改查示例1-列表查询界面

先上效果图：

*************************************以下是代码截图**************************************

因为前端代码贴过来很多都直接变成前端组件了，所以直接截图

1、导入的js、css引用，以及angularJs需要注意的地方，如：ng-app="" 与 ng-controller=""

 2、查询列表：这里做的是级联下拉，使用的是ng-options=""来初始化下拉列表数据的。

简要逻辑：1）、通过angularJS页面初始化指令ng-init=""内的方法来调用JS查询方法

    2）、JS查询方法发送请求从后台获得各种数据（如：下拉数据、列表数据等）。

    3）、JS查询方法将获得的各种数据封装给各自的对象（例如：下拉数据对象：vm.productLists和vm.planjson；列表数据对象：vm.items ）

3、按钮栏。

注：页面 初始化指令：ng-init=""(前面已介绍)

4、查询列表标题行。

5、查询列表数据行。

逻辑：1）、ng-init=""初始化指令方法调用js查询方法向后台发送请求，获取各种查询页面的初始化数据（包含查询页面列表数据）

      2）、js查询方法获取到列表数据后封装给vm.items对象

      3）、页面通过ng-repeat=""接收js封装的vm.items对象，并进行逐行解析。

注：下图代码存在单选列和隐藏值

6、分页