angularjs

http://blog.jobbole.com/49745/
http://runjs.cn/code/gspvlfrw
http://runjs.cn/code/r72hgjwg
增删改
http://www.itstrike.cn/Question/cc54371f-3d10-475e-9d07-3047892ff275.html
引入js引擎
<script id="others_angular_103" type="text/javascript" class="library" src="/js/sandbox/other/angular.min.js"></script>
脚本：
初始化js引擎，并将从后台的获数据model放到control里（通过$scope变量）,一个control一个名字，jsp中自动对应control中的显示
var app = angular.module('MyApp',[]);

app.controller('testC',function($scope){
$scope.counter = 0;
 
  $scope.test2='111';
  $scope.test3='1';
  $scope.test4='11';
  $scope.test5='333';
  $scope.test6='';
  $scope.test7='';
  $scope.add = function(amount) {
$scope.counter += amount;
$scope.test1=$scope.counter;};//作用域的问题
});

//发起请求服务部分，注册好服务
app.factory('githubService', ['$http', function($http) {

    var doRequest = function(username, path) {
      return $http({
        method: 'JSONP',
        url: 'https://api.github.com/users/' + username + '/' + path + '?callback=JSON_CALLBACK'
      });
    }
    return {
      events: function(username) { return doRequest(username, 'events'); },
    };
  }]);

//类似于数据一样，将服务和contorl绑定供前台使用，函数前面的是参数
app.controller('ServiceController', ['$scope', 'githubService',
     function($scope, githubService) {
  $scope.$watch('username', function(newUsername) {
githubService.events(newUsername)
        .success(function(data, status, headers) {
$scope.events = data.data;

        })
    });

}

]);


jsp:
先指定相应的control，再在ng-model中同名应用js中同名的变量的值，如果需要校验加上相应的关键字即可自动验证
<div ng-controller="testC">
  <form name="myform" novalidate>
    required: <input type="text" name="test1" ng-model="test1" required ng-click="add(1)"><br />
    ng-minlength(3): <input type="text" name="test2" ng-model="test2" ng-minlength="3"><br />
    ng-maxlength(10): <input type="text" name="test3" ng-model="test3" ng-maxlength="10"><br />
    ng-pattern(/[a-f]/): <input type="text" name="test4" ng-model="test4" ng-pattern="/[a-f]/"><br />
    type="number"(2-8): <input type="number" name="test5" max="8" min="2" ng-model="test5"><br />
    type="url": <input type="url" name="test6" ng-model="test6"><br/>
    type="email": <input type="email" name="test7" ng-model="test7"><br/>

  </form>

  //表单数据的引用
   myform.test1.$invalid : {{test1}}<br />直接用表单中的name
 
 
  <div>
    <h2>表单验证结果：</h2>
    myform.$invalid : {{myform.$invalid}}<br />
    myform.$valid : {{myform.$valid}}<br />
    myform.$pristine : {{myform.$pristine}}<br />
    myform.$dirty : {{myform.$dirty}}<br />
myform.$error : {{myform.$error}}<br />
    <h2>表单项验证结果</h2>
    required:<br />
    myform.test1.$invalid : {{myform.test1.$invalid}}<br />
    myform.test1.$valid : {{myform.test1.$valid}}<br />
    myform.test1.$pristine : {{myform.test1.$pristine}}<br />
    myform.test1.$dirty : {{myform.test1.$dirty}}<br />
myform.test1.$error : {{myform.test1.$error}}<br />
myform.test2.$error : {{myform.test2.$error}}<br />
<h4>Current count: {{ counter }}</h4>
  </div>
  //前台jsp应用服务传参发起请求部分，之所以会输入完自动发起请求是用了$watch字段

<div ng-controller="ServiceController">
  <label for="username">Type in a GitHub username</label>
  <input type="text" ng-model="username" placeholder="Enter a GitHub username, like auser" />
  <pre ng-show="username">{{ events }}</pre>
</div>

用户名传：aa可以看到效果