本文实例讲述了Angular使用操作事件指令ng-click传多个参数功能。分享给大家供大家参考,具体如下:

<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>www.jb51.net angular ng-click用于操作事件的指令</title>
<script src="angular.min.js"></script>
<!--
事件指令:Angular封装的用于操作事件的指令
通常是ng-[event]来命名指令,如ng-click表示单击事件
Angular中的事件处理,需要将处理函数挂载到对应控制器的$scope上
-->
</head>
<body>
<div ng-controller="myCtrl">
<button ng-click="fn1()">点击执行</button>
<button ng-click="fn2($event)">点击执行,附带事件对象$event</button>
<button ng-click="fn2($event, 'tom')">点击执行,多个参数</button>
</div>
<script>
var app = angular.module("myApp", [])
.controller("myCtrl", ["$scope", function($scope) {
$scope.fn1 = function() {
alert("事件执行");
}
$scope.fn2 = function(event,name) {
console.log("事件执行了.", event, name);
}
}]);
</script>
</body>
</html> 运行效果如下:

Angular使用操作事件指令ng-click传多个参数示例的更多相关文章

  1. Angular——事件指令

    基本介绍 angular的事件指令都是ng-click,ng-blur....的形式,类似于js的事件 基本使用 <!DOCTYPE html> <html lang="e ...

  2. Vue框架(一)——Vue导读、Vue实例(挂载点el、数据data、过滤器filters)、Vue指令(文本指令v-text、事件指令v-on、属性指令v-bind、表单指令v-model)

    Vue导读 1.Vue框架 vue是可以独立完成前后端分离式web项目的js框架 三大主流框架之一:Angular.React.Vue vue:结合其他框架优点.轻量级.中文API.数据驱动.双向绑定 ...

  3. 第一章、VUE-挂载点-实例成员-数据-过滤器-文本指令-事件指令-属性指令-表单指令-01

    目录 路飞项目 vue vue 导读 vue 的优势 渐进式框架 引入 vue 实例成员 - 挂载点 el js 对象(字典)补充 实例成员 - 数据 data 实例成员 - 过滤器 filters ...

  4. VUE-挂载点-实例成员-数据-过滤器-文本指令-事件指令-属性指令-表单指令-01

    目录 路飞项目 vue vue 导读 vue 的优势 渐进式框架 引入 vue 实例成员 - 挂载点 el js 对象(字典)补充 实例成员 - 数据 data 实例成员 - 过滤器 filters ...

  5. Vue框架:挂载点-过滤器-事件指令-表单指令

    近期学习安排 1.Vue框架 前台html+css+js框架,是不同于js与JQuery的数据驱动框架, 学习的知识点:指令 |  实例成员 | vue项目 2.drf框架 django的插件,完成前 ...

  6. [Vue入门及介绍,基础使用、MVVM架构、插值表达式、文本指令、事件指令]

    [Vue入门及介绍,基础使用.MVVM架构.插值表达式.文本指令.事件指令] 1)定义:javascript渐进式框架 ​ 渐进式:可以控制一个页面的一个标签,也可以控制一系列标签,也可以控制整个页面 ...

  7. angular使用post、get向后台传参的问题

    一.问题的来源 我们都知道向后台传参可以使用get.put,其形式就类似于name=jyy&id=001.但是在ng中我却发现使用$http post进行异步传输的过程中后台是接收不到数据的. ...

  8. AngularJS1.X学习笔记4-内置事件指令及其他

    AngularJS为我们定义了一系列事件指令,方便我们对用户的操作作出响应.甚至他还有一个可选模块提供了触摸事件和手势事件的支持,为移动端开发提供了可能.现在开始学习一下AngularJS的事件指令. ...

  9. Vue之挂载点、变量、事件、js对象、文本指令、过滤器、事件指令和属性指令

    1.vue导入-挂载点 <!DOCTYPE html> <html lang="zh"> <head> <meta charset=&qu ...

随机推荐

  1. OkHttp3 readError问题解决

    有些时候是服务端响应的太慢而本地链接又关闭引起的读取失败. 这时候可以调整本地链接关闭的时间. 例如以下设置超时关闭的时间为120秒. OkHttpClient okHttpClient = new ...

  2. 二分查找时间复杂度、partition时间复杂度

    二分查找时间复杂度 partition时间复杂度 O(n) = O(n) + O(n/2) + O(n/4)+.... 然后用等比求和公式得出是O(2n),即O(n)

  3. mysql插入数据报错IntegrityError: (1062, "Duplicate entry 'xx' for key 'xxxxx'")

    1.问题描述 MySQL插入数据的时候报错,提示如下: IntegrityError: (1062, "Duplicate entry 'xx' for key 'xxxxx'") ...

  4. FastStone Capture 9.3 强烈推荐,常用功能介绍

    http://www.dayanzai.me/faststone-capture.html   经典优秀屏幕截图录像工具 FastStone Capture 9.3 绿色汉化中文版 下载 官网: ht ...

  5. Google软件测试之道笔记与总结

    [本文出自天外归云的博客园] 以下内容除了笔记还有总结,有个人理解的成分在内. 第一章笔记与总结 1. 开发人员也承担了质量的重任,质量从来就不仅仅是一些测试人员的问题.头衔有测试字样的人的任务是让那 ...

  6. mysql数据库架构设计与优化

    mysql数据库架构设计与优化 2019-04-23 20:51:20 无畏D尘埃 阅读数 179  收藏 更多 分类专栏: MySQL   版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA ...

  7. 文档工具的王者Sphinx

    Sphinx https://www.sphinx.org.cn/ Sphinx是一个工具,可以轻松创建由Georg Brandl编写并根据BSD许可证授权的智能和美观文档 它最初是为Python文档 ...

  8. 定制flask-admin的主页

    flask也用了很久了,一般配合flask-admin设置后台. 但是flask-admin设置的都是自己加入的,对某些model进行管理. 下面介绍如何定制flask-admin的首页. 原来我们引 ...

  9. 数学黑洞:卡普雷卡尔常数的php算法实现

    首先看一篇文章: 英国广播公司报道,6174乍看没什么奇特之处,但是,自从1949年以来,它一直令数学家.数字控抓狂.痴迷. 不管你挑的四位数是什么,早早晚晚你都会遇到6174:而且,遇到6174就只 ...

  10. ejs不能读取js变量??????

    一.问题描述 用express搭了一个nodejs服务端,为了测试接口数据是否能够正常输出,用ejs作为模版引擎的html文件写js发请求. 1.请求正常,能在network看到,但是没有输出cons ...