AngularJS 05（事件绑定）

事件绑定
文本变化、鼠标点击、鼠标移动

ng-change
文本变化
ng-change必须配合ng-model才能使用

<div ng-controller="changeCtrl"><label id="lbl" class="label label-info"></label><input ng-model="msg" ng-change="changeFunc(msg)" type="text" class="form-control" /></div><script>        function changeCtrl($scope){            $scope.changeFunc=function(msg){                var msg=msg.replace("abc","你好");                $("#lbl").html(msg);            };        }</script>

ng-click、ng-dblclick
$event.target获取的是DOM元素如果想要操作元素需要转换成jQuery对象进行操作

<div ng-controller="bookCtrl">    <ul>        <li class="list-group-item" ng-repeat="b in books">            <span class="glyphicon glyphicon-bookmark"></span>            <span data-price="{{b.Price}}" ng-dblclick="showpriceFunc($event.target)">{{b.Title}}</span>            <span data-id="{{b.Id}}" ng-click="hideFunc($event.target)" style="cursor:pointer ;" class="pull-right glyphicon glyphicon-remove"></span>        </li>    </ul></div><script>        function bookCtrl($scope,$http){            $http.get("json/books.json")            .success(function(r){                $scope.books=r;            });            $scope.hideFunc=function(t){                alert("删除编号为【"+$(t).attr("data-id")+"】的图书");                $(t).parent().hide(1000);            };            $scope.showpriceFunc=function(p){                alert($(p).attr("data-price"));            }        }</script>

ng-mousedown
ng-mouseenter
ng-mouseleave
ng-mousemove
ng-mouseover
ng-mouseup

$even.tartget

angularJS正则校验综合案例

<form id="formLogin" name="formLogin" action="ngForm.html">                <!--form-control-feedback将span图标显示在input输入框内部-->                <div class="form-group has-feedback" data-ng-class="formLogin.userName.$dirty?(formLogin.userName.$valid?'has-success':'has-error'):''">                    <label class="control-label" for="userName">UserName</label>                    <input required type="text" name="userName" id="userName" class="form-control"  data-ng-model="userName" data-ng-minlength="3" data-ng-maxlength="6"/>                    <span data-ng-show="formLogin.userName.$dirty && formLogin.userName.$valid" data-ng-class="'glyphicon-ok'" class="glyphicon form-control-feedback"></span>                    <span data-ng-show="formLogin.userName.$dirty && formLogin.userName.$invalid" data-ng-class="'glyphicon-remove'" class="glyphicon form-control-feedback"></span>                </div>                <div class="form-group has-feedback" data-ng-class="formLogin.email.$dirty?(formLogin.email.$valid?'has-success':'has-error'):''">                    <label class="control-label" for="email">email</label>                    <input required type="email" name="email" id="email" class="form-control" data-ng-model="email" />                    <span ng-show="formLogin.email.$dirty && formLogin.email.$valid" ng-class="'glyphicon-ok'" class="glyphicon form-control-feedback"></span>                    <span ng-show="formLogin.email.$dirty && formLogin.email.$invalid" ng-class="'glyphicon-remove'" class="glyphicon form-control-feedback"></span>                </div>                <p class="text-right">                    <button type="submit" class="btn btn-primary">Login</button>                </p></form>

只要写在ng-app中ng-model=”“绑定的变量就算ng-init和控制器中没有声明，也可以使用。