本文和大家分享的主要是AngularJS中事件绑定相关知识点,希望通过本文的分享,对大家学习和使用AngularJS有所帮助。
1.绑定事件:表达式、事件方法名;
2.绑定点击事件实例:显示、隐藏页面元素;
3.元素内容改变事件:ng-change;
4.按下按键事件:ng-keypress;
5.提交表单事件:ng-submit;
代码
LESSON 5
#content1{padding:16px;}
点击数:{{Counter}}
这里是文章内容
姓名
年龄
星座
{{x[0]}}
{{x[1]}}
{{x[2]}}
ID
姓名
年龄
星座
工作年限
操作
座' ">
{{$index+1}}
{{x.Name | uppercase}}
{{x.Age}}
{{x.Constellation}}
{{x.WorkYear}}
var app = angular.module("lesson",[]);
app.controller("lesson5",function($scope){
$scope.UserNameList = ["Tom","Jerry","David","Tim"];
$scope.UserEntityList = [
{'Name':'Tim','Age':39,'Constellation':'摩羯座','WorkYear':19},
{'Name':'Tom','Age':26,'Constellation':'水瓶座','WorkYear':39},
{'Name':'David','Age':28,'Constellation':'天秤座','WorkYear':7},
{'Name':'Jerry','Age':26,'Constellation':'巨蟹座','WorkYear':139}
];
$scope.UserInfoList =[
["Tom",26,"水瓶座"],
["Jerry",27,"巨蟹座"],
["David",28,"天秤座"],
["Tim",39,"摩羯座"]
];
$scope.DeleteUser = function(userName){
$scope.UserEntityList.forEach(function(user,i,list){
if(user.Name==userName){
list.splice(i,1);
}
})
}
$scope.Counter = 0;
$scope.CounterClick= function(){
$scope.Counter=$scope.Counter+1;
}
$scope.ContentFlag = true;
$scope.HideContent = function(){
$scope.ContentFlag = !$scope.ContentFlag;
}
$scope.SubmitForm = function(){
var name = $scope.NewName;
var age = $scope.NewAge;
console.log(
{name:name,age:age}
);
return false;
}
});
执行结果
原文链接:http://www.maiziedu.com/wiki/angularjs/event/