AngularJS的ng-click传参的方法


Posted in Javascript onJune 19, 2017

今天遇到个难题就是ng-click传参问题,在网上找了好多资料,先留个笔记

<ul id="dataSet" ng-repeat="item in infos" ng-model="dataSet">
  <li ng-click="sentOutQuery('{{item.detailId}}')" >
    <div class="voucherLeft">
      <p class="p1">{{item.transAmount}}</p>
      <p class="p2">已分配:<span >{{item.usePoints}}</span></p>
    </div>
    <div class="voucherRight">
      <p class="p3">授信方:<span>{{item.rollOutAccountName}}</span></p>
      <p class="p4">授信日期:<span>{{item.createTime}}</span></p>
    </div>
  </li>
</ul>
//js代码
$scope.sentOutQuery = function(sourceDetail){
  var expiresDate= new Date();
  expiresDate.setTime(expiresDate.getTime() + 2*1000);
  $cookieStore.put("sourceDetailId", sourceDetail,{expires : expiresDate});
  console.log(sourceDetail); 
  window.location.href='sentOutQuery.html';
}

ng-click="sentOutQuery('{{item.detailId}}')" 这样虽然在页面上debugger能看到传的参数值,但是这样事件点击无效,如下图;

 AngularJS的ng-click传参的方法

只有将点击事件中的参数直接引入才能在对应的JS代码中获取该参数

AngularJS的ng-click传参的方法

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 数组循环引起的思考
Jan 01 Javascript
深入理解JavaScript系列(3) 全面解析Module模式
Jan 15 Javascript
解析jQuery与其它js(Prototype)库兼容共存
Jul 04 Javascript
使用jQuery避免鼠标双击的解决方案
Aug 21 Javascript
通过js获取上传的图片信息(临时保存路径,名称,大小)然后通过ajax传递给后端的方法
Oct 01 Javascript
angularJs使用ng-repeat遍历后选中某一个的方法
Sep 30 Javascript
layui实现下拉框三级联动
Jul 26 Javascript
vue 内联样式style中的background用法说明
Aug 05 Javascript
vue 扩展现有组件的操作
Aug 14 Javascript
Vue环境搭建+VSCode+Win10的详细教程
Aug 19 Javascript
vant 解决tab切换插件标题样式自定义的问题
Nov 13 Javascript
js面向对象封装级联下拉菜单列表的实现步骤
Feb 08 Javascript
JavaScript队列函数和异步执行详解
Jun 19 #Javascript
JS检测是否可以访问公网服务器功能代码
Jun 19 #Javascript
详解angularJS动态生成的页面中ng-click无效解决办法
Jun 19 #Javascript
详解AngularJS脏检查机制及$timeout的妙用
Jun 19 #Javascript
深入理解AngularJs-scope的脏检查(一)
Jun 19 #Javascript
jQuery 实现双击编辑表格功能
Jun 19 #jQuery
Web制作验证码功能实例代码
Jun 19 #Javascript
You might like
PHP生成网页快照 不用COM不用扩展.
2010/02/11 PHP
PHPWind与Discuz截取字符函数substrs与cutstr性能比较
2011/12/05 PHP
PHP正则表达式 /i, /is, /s, /isU等介绍
2014/10/23 PHP
Symfony控制层深入详解
2016/03/17 PHP
php获取微信共享收货地址的方法
2017/12/21 PHP
js实现一个省市区三级联动选择框代码分享
2013/03/06 Javascript
转换字符串为json对象的方法详解
2013/11/29 Javascript
jquery基础教程之deferred对象使用方法
2014/01/22 Javascript
纯JS实现根据CSS的class选择DOM
2014/03/22 Javascript
网页右侧悬浮滚动在线qq客服代码示例
2014/04/28 Javascript
js用Date对象的setDate()函数对日期进行加减操作
2014/09/18 Javascript
JS判断输入的字符串是否是数字的方法(正则表达式)
2016/11/29 Javascript
JavaScript中数组Array.sort()排序方法详解
2017/03/01 Javascript
JavaScript实现单击网页任意位置打开新窗口与关闭窗口的方法
2017/09/21 Javascript
Vue的事件响应式进度条组件实例详解
2018/02/04 Javascript
微信小程序实现倒计时功能
2020/11/19 Javascript
Vue使用Ref跨层级获取组件的步骤
2021/01/25 Vue.js
[03:32]2014DOTA2西雅图邀请赛 CIS外卡赛赛前black专访
2014/07/09 DOTA
Pycharm学习教程(4) Python解释器的相关配置
2017/05/03 Python
在Python中获取两数相除的商和余数方法
2018/11/10 Python
python-itchat 获取微信群用户信息的实例
2019/02/21 Python
python调用虹软2.0第三版的具体使用
2019/02/22 Python
Python函数装饰器常见使用方法实例详解
2019/03/30 Python
Python3实现计算两个数组的交集算法示例
2019/04/03 Python
python读取配置文件方式(ini、yaml、xml)
2020/04/09 Python
jupyter notebook 添加kernel permission denied的操作
2020/04/21 Python
python文件排序的方法总结
2020/09/13 Python
python实现发送带附件的邮件代码分享
2020/09/22 Python
神经网络训练采用gpu设置的方式
2021/03/03 Python
Omio俄罗斯:一次搜索公共汽车、火车和飞机的机票
2018/11/17 全球购物
十佳大学生村官事迹
2014/01/09 职场文书
高中生评语大全
2014/04/25 职场文书
个人欠款协议书范本2014
2014/11/02 职场文书
建筑质检员岗位职责
2015/04/08 职场文书
铁人纪念馆观后感
2015/06/16 职场文书
担保书范文
2019/07/09 职场文书