Angular使用操作事件指令ng-click传多个参数示例


Posted in Javascript onMarch 27, 2018

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

<!DOCTYPE html>
<html ng-app="myApp">
<head>
  <meta charset="UTF-8">
  <title>3water.com 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传多个参数示例

希望本文所述对大家AngularJS程序设计有所帮助。

Javascript 相关文章推荐
HTML代码中标签的全部属性 中文注释说明
Mar 26 Javascript
javascript中window.event事件用法详解
Dec 11 Javascript
jQuery中:has选择器用法实例
Dec 30 Javascript
使用AngularJS和PHP的Laravel实现单页评论的方法
Jun 19 Javascript
用js实现简单算法的实例代码
Sep 24 Javascript
一个例子轻松学会Vue.js
Jan 02 Javascript
js中new一个对象的过程
Feb 20 Javascript
jQuery阻止移动端遮罩层后页面滚动
Mar 15 Javascript
Vue计算属性的学习笔记
Mar 22 Javascript
Angular2监听页面大小变化的解决方法
Oct 09 Javascript
vue ssr+koa2构建服务端渲染的示例代码
Mar 23 Javascript
vue+iview使用树形控件的具体使用
Nov 02 Javascript
JavaScript代码实现txt文件的上传预览功能
Mar 27 #Javascript
Angularjs实现控制器之间通信方式实例总结
Mar 27 #Javascript
Angular中使用better-scroll插件的方法
Mar 27 #Javascript
使用node打造自己的命令行工具方法教程
Mar 26 #Javascript
详解Vue 全局引入bass.scss 处理方案
Mar 26 #Javascript
js构建二叉树进行数值数组的去重与优化详解
Mar 26 #Javascript
红黑树的插入详解及Javascript实现方法示例
Mar 26 #Javascript
You might like
mysql5的sql文件导入到mysql4的方法
2008/10/19 PHP
PHP_Cooikes不同页面无法传递的解决方法
2014/03/07 PHP
PHP实现删除字符串中任何字符的函数
2015/08/11 PHP
Yii核心验证器api详解
2016/11/23 PHP
php判断str字符串是否是xml格式数据的方法示例
2017/07/26 PHP
php封装的pdo数据库操作工具类与用法示例
2019/05/08 PHP
Swoole扩展的6种模式深入详解
2021/03/04 PHP
dojo 之基础篇
2007/03/24 Javascript
常用简易JavaScript函数
2009/04/09 Javascript
JavaScript编程开发中的五个实用小技巧
2010/07/22 Javascript
jQuery实现html表格动态添加新行的方法
2015/05/28 Javascript
javascript中sort() 方法使用详解
2015/08/30 Javascript
js与jquery正则验证电子邮箱、手机号、邮政编码的方法
2016/07/04 Javascript
JavaScript基础知识点归纳(推荐)
2016/07/09 Javascript
jQuery实现点击查看大图并以弹框的形式居中
2016/08/08 Javascript
Vue.js教程之计算属性
2016/11/11 Javascript
详解Angular系列之变化检测(Change Detection)
2018/02/26 Javascript
javascript设计模式 ? 迭代器模式原理与用法实例分析
2020/04/17 Javascript
Python3操作SQL Server数据库(实例讲解)
2017/10/21 Python
python字符串string的内置方法实例详解
2018/05/14 Python
python实现猜单词小游戏
2020/05/22 Python
基于Python List的赋值方法
2018/06/23 Python
解决Pycharm调用Turtle时 窗口一闪而过的问题
2019/02/16 Python
python实现简易学生信息管理系统
2020/04/05 Python
深入浅析Python 中的sklearn模型选择
2019/10/12 Python
python GUI库图形界面开发之PyQt5窗口控件QWidget详细使用方法
2020/02/26 Python
贝玲妃英国官网:Benefit英国
2018/02/03 全球购物
巴黎一票通:The Paris Pass
2018/02/10 全球购物
铁路安全事故反思
2014/04/26 职场文书
酒店服务员岗位职责
2015/02/09 职场文书
事业单位财务人员岗位职责
2015/04/14 职场文书
车辆管理制度范本
2015/08/05 职场文书
2016年“六一儿童节”校园广播稿
2015/12/17 职场文书
写给汽车4S店的创业计划书,拿来即用!
2019/08/09 职场文书
掌握这项技巧,一年阅读300本书不是梦
2019/09/12 职场文书
升级 Win11 还是坚守 Win10?微软 Win11 新系统缺失功能大盘点
2022/04/05 数码科技