AngularJS 是一个 JavaScript 框架。通过 指令 扩展了 HTML，且通过 表达式 绑定数据到 HTML。

1.四大特征

MVC模式、模块化、自动化双向数据绑定、依赖注入

2.使用

　　1）首先在页面引入核心包

　　　　

　　2）必须在body标签上写 ng-app

　　　　

　　3）用 {{表达式或变量}} 展示数据

　　　　如:{{ firstName }} 是通过 ng-model="firstName" 进行同步

　　4）ng-model ：相当于name传值,前端也可以根据ng-model获取值存放到$scope中

　　5）$scope：是AngularJs 内置对象，有请求数据也有相应数据

　　6）$ng-init：只要页面一执行，首先会执行ng-init中的操作

　　7）var app=angular.module('app',[])  ==》定义了叫app的模块，定义以后一定要在body标签中声明使用的模块名称，

　　　其中[]中是用力啊放插件的

　　8）ng-click：鼠标点击事件==》onclick

　　9）ng-repeat="x in list"：相当于遍历list中的每一个x

　　10）$http：AngularJs 内置对象，主要作用发送http请求，并且发送ajax

　　　　$http.get     $http.post

　　11）$event：可以获取当前操作的事件是什么，常用于复选框==》复选框哪个被勾选

1.小问题

1）在新增完成后，增加成功后会在增加窗口留下值，在下一次新增时，默认是上次增加的值，

显然，我们在新增时不需要这种回显数据，故应在新建中声明ng-click="entity={}"

如： 新建

2）按钮点击无效

ng-click="dele()"不要忘记（）

2.查询所有js

var app=angular.module('brandApp',['pagination'])//[]中为插件
app.controller('brandController',function($scope,$http){//$http 发送ajax
$scope.findAll=function(){
$http.get('../brand/findAll.do').success(function(response){
$scope.list=response;
})
}
});

3.分页查询js代码

//重新加载列表 数据
$scope.reloadList=function(){
//切换页码
$scope.findPage( $scope.paginationConf.currentPage, $scope.paginationConf.itemsPerPage);
}
//分页控件配置
$scope.paginationConf = {
// 当前页
currentPage: 1,
// 默认每页条数
totalItems: 10,
//每页展示多少条数据
itemsPerPage: 10,
//每页展示多少条数据的下拉框 可以手动调
perPageOptions: [10, 20, 30, 40, 50],
onChange: function(){
$scope.reloadList();//重新加载
}
};

        //分页          第一个参数是当前页  第二个参数：每页展示的数据条数  
        $scope.findPage=function(page,rows){  
            $http.get('../brand/findPage.do?page='+page+'&rows='+rows).success(  
                function(response){  
                    // 返回的数据集合  list<Brand>  
                    $scope.list=response.rows;  
                    // 查询的总记录数  
                    $scope.paginationConf.totalItems=response.total;//更新总记录数  
                }  
            );  
        }

4.新增和修改保存js

通过查询id是否存在，判断是新增还是修改

     　 $scope.save=function(){  
            var methodName='add';  
    if($scope.entity.id!=null){//id不为null则代表着已经存在,应为修改brand  
    　　methodName='update';  
    }

            $http.post('../brand/'+methodName+'.do',$scope.entity ).success(  
                function(response){  
                    if(response.success){  
                        //重新查询  
        　　 alert(response.message);  
                        $scope.reloadList();//重新加载  
                    }else{  
                        alert(response.message);  
                    }  
                }  
            );  
        }

　　　　　　//查询修改的实体
　　　　　　　　$scope.findOne=function(id){
　　　　　　　　　　$http.get('../brand/findOne.do?id='+id).success(
　　　　　　　　　　　　　function(response){
　　　　　　　　　　　　　　　　$scope.entity= response;
　　　　　　　　　　　　　}
　　　　　　　　　　);
　　　　　　　　}

5.批量删除

　　　　　　　$scope.selectIds=[];//选中的ID集合

　　//更新复选  
        $scope.updateSelection = function($event, id) {//$event可以获取当前操作的事件是什么  
            if($event.target.checked){//如果是被选中,则增加到数组  
                $scope.selectIds.push(id);  
            }else{  
                var idx = $scope.selectIds.indexOf(id);  
                $scope.selectIds.splice(idx, 1);//删除  
            }  
        }

　　//批量删除  
        $scope.dele=function(){  
            //获取选中的复选框  
            $http.get('../brand/delete.do?ids='+$scope.selectIds).success(  
                function(response){  
                    if(response.success){  
                        alert(response.message);  
                        $scope.reloadList();//刷新列表  
                    }else{  
                        alert(response.message);  
    　　　　　}  
                }  
            );  
        }