AngularJS重型前端框架

一、AngularJs

　　AngularJs是一种前端的重型框架，而现在正在被Aue.js所取代。而Aue的和AngularJs大同小异。

　　AngularJs核心功能有MVC、模块化、自动化双向数据绑定、依赖注入等等。

　　我在刚接触时，会感觉到是一个另类的java代码，它包括前端，controller层，service层，这实在是有点像java代码。而它controller层中也类似java是调用相应的service层代码；service层有点区别，Angular中的service层是发送请求，而这好像就是AngularJs的核心功能MVC。

　　依赖注入即前端函数中的形参，可以直接注入到controller。

　　1.1前端页面指令

　　　　1、ng-model:用于绑定数据，可以将输入到文本框中，可以实时输出变量。

　　　　2、ng-init:在访问页面的时候同时加载该函数。

　　　　3、ng-click:点击事件。传递具体数据ng-click(方法名('1'))。常用的还是点击事件。

　　　　4、ng-app:指令用于告诉 AngularJS 应用当前这个元素是根元素,不太了解没学前端。

　　　　5、ng-repeat="x in list"：循环指令

　　　　6、ng-if="条件":判断指令

　　　1.2表达式

　　　　{{entity.id}}:可以取值。

　　　2.1controller层　　

　　　　　　我感觉其中就是给页面中的事件，调用service层的方法，然后就是该方法成功返回后的事件。

//搜索，$scope.search前端页面中的search事件，page，rows是参数
    $scope.search=function(page,rows){      
　　　　//调用service层的方法，并传入参数，success后的处理      
        goodsService.search(page,rows,$scope.searchEntity).success(
            function(response){
                $scope.list=response.rows;    
                $scope.paginationConf.totalItems=response.total;//更新总记录数
            }            
        );
    }

　　2.2service层

　　　　service层主要就是发送请求。而事务则是使用的@Transactional注解。

//搜索
    this.search=function(page,rows,searchEntity){
//路径中.do是在web.xml中规定的
        return $http.post('../goods/search.do?page='+page+"&rows="+rows, searchEntity);
    }

二、开发

　　　　与常规的ssm开发不尽相同。分布式开发时模块开发，所以可能controller层，并不是和service是同一模块，这样相同的方法就可以重复调用。

　　　　1.1controller层

　　　　　　与常规的ssm开发略微的不同，其中的注入service使用的是@Reference，该注解是ali下的。

　　　　1.2service层

　　　　　　其中@Service注解是ali下的。