您现在的位置:首页 >> 前端 >> 内容

AngularJs的事件处理指令测试

时间:2018/2/13 15:23:35 点击:

  核心提示:AngularJs的事件处理指令测试如下:今天统一用到的JavaScript代码如下:var m = angular.module(app, []); m.controller(ctrl, [$sco...

AngularJs的事件处理指令测试如下:

今天统一用到的JavaScript代码如下:

var m = angular.module('app', []);

   m.controller('ctrl', ['$scope', function($scope){

       $scope.data = '赵一鸣技术博客';

       $scope.func = function(){

           alert($scope.data);

       }

   }]);

html中的AngularJs指令代码:

1、鼠标点击事件:

<input type="text" ng-click="func()"/>

2、鼠标滑过事件:

<input type="text" ng-mouseover="func()"/>

3、鼠标滑出事件:

<input type="text" ng-mouseout="func()"/>

4、鼠标按下事件:

<input type="text" ng-mousedown="func()"/>

5、鼠标抬起事件:

<input type="text" ng-mouseup="func()"/>

6、鼠标双击事件:

<input type="text" ng-dblclick="func()"/>

7、获得焦点事件:

<input type="text" ng-focus="func()"/>

8、失去焦点事件:

<input type="text" ng-blur="func()"/>

9、表单内容改变:

<input type="text" ng-change="func()" ng-model="title"/>

注意,使用ng-change的时候,一定要加ng-model,否则会报错。

Tags:AN NG GU UL 
作者:网络 来源:KHOST的博客