事件参数$event
例1 关于ag中的this及事件源:
<input type="button" value="test" ng-click="doTest($event)">
------------------------------------
$scope.name="myname";
$scope.doTest=function(ent){
;//事件参数通过页面的$event传入
console.log(this.name);
;//myname--这里this不再表示事件源,而是当前作用域对象
console.log(ent.target.value);
;//test--事件源封装在事件参数的target属性中
console.log(angular.element(ent.target).val());
;//test--angular.element方法可以将DOM元素封装为jquery对象,如果引用了jquery库,则可以直接使用$函数
};
例2 简易计算器:
<div ng-controller="CalcController">
<p>
<label for="n1">数字1:</label>
<input type="text" id="n1" ng-model="num1">
</p>
<p>
<label for="n2">数字2:</label>
<input type="text" id="n2" ng-model="num2">
</p>
<p>
<input type="button" value="+" ng-click="doCalc($event)">
<input type="button" value="-" ng-click="doCalc($event)">
<input type="button" value="*" ng-click="doCalc($event)">
<input type="button" value="/" ng-click="doCalc($event)">
</p>
<p>
<h1>result:<span ng-bind="result"></span></h1>
</p>
</div>
--------------------------------
angular.module('myApp', [])
.controller('CalcController', ['$scope', function($scope){
$scope.doCalc=function(ent){
var op=ent.target.value;
if(isNaN(this.num1) || isNaN(this.num2)){
$scope.result="无法计算";
}
else{
var n1=parseFloat($scope.num1);
//强制转换为浮点型
var n2=parseFloat($scope.num2);
console.log(typeof eval(n1+op+n2));
$scope.result=eval(n1+op+n2).toFixed(3);
//eval()把 参数string 进行计算,结果为number类型
//toFixed()把 Number 四舍五入为指定小数位数的数字
}
};
}])