angular中子控制器向父控制器传值的实例


Posted in Javascript onOctober 08, 2018

如下所示:

angular中子控制器向父控制器传值的实例

angular中子控制器向父控制器传值的实例

子级指令app-sheet中,使用sheet.html作为模版。

在sheet.html中有个点击click事件,selectTablist(item),这里的item就是在子级指令app-sheet中用户click选择的item。

在sheet.js中,通过scope:{selectTablist:'&'},和父级共享这个方法。

angular中子控制器向父控制器传值的实例

angular中子控制器向父控制器传值的实例

在整个顶层的路由中,search.html和searchCtrl是互相绑定的。

而在search.html中,使用app-sheet指令的时候,通过select-tablist=”sClick(id,name)”,表明父级子级共享的selectTablist方法,是由父级的searchCtrl中的sClick(id,name)传入的。

angular中子控制器向父控制器传值的实例

angular中子控制器向父控制器传值的实例

angular中子控制器向父控制器传值的实例

子级里面点击的“c1 北京”的内容就可以通过父级的searchCtrl中的sClick方法打印出来

这样,父级的searchCtrl就获得了app-sheet指令里面的值。

以上这篇angular中子控制器向父控制器传值的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript 设计模式(二) 闭包
May 26 Javascript
通过Jquery遍历Json的两种数据结构的实现代码
Jan 19 Javascript
JS打开新窗口的2种方式
Apr 18 Javascript
javascript中的括号()用法小结
Apr 14 Javascript
jquery $.trim()方法使用介绍
May 21 Javascript
深入理解JavaScript系列(48):对象创建模式(下篇)
Mar 04 Javascript
jquery衣服颜色选取插件效果代码分享
Aug 28 Javascript
javascript中闭包概念与用法深入理解
Dec 15 Javascript
bootstrap侧边栏圆点导航
Jan 11 Javascript
webpack入门必知必会
Jan 16 Javascript
Vue中使用vue-i18插件实现多语言切换功能
Apr 25 Javascript
微信小程序点击保存图片到本机功能
Dec 13 Javascript
对angularjs框架下controller间的传值方法详解
Oct 08 #Javascript
对angularJs中controller控制器scope父子集作用域的实例讲解
Oct 08 #Javascript
CKEditor4配置与开发详细中文说明文档
Oct 08 #Javascript
浅谈angularJs函数的使用方法(大小写转换,拷贝,扩充对象)
Oct 08 #Javascript
angularJs复选框checkbox选中进行ng-show显示隐藏的方法
Oct 08 #Javascript
jquery.param()实现数组或对象的序列化方法
Oct 08 #jQuery
angularJs select绑定的model取不到值的解决方法
Oct 08 #Javascript
You might like
评分9.0以上的动画电影,剧情除了经典还很燃
2020/03/04 日漫
PHP6 mysql连接方式说明
2009/02/09 PHP
Windows 下的 PHP-PEAR 安装方法
2010/11/20 PHP
Laravel 之url参数,获取路由参数的例子
2019/10/21 PHP
javascript 动态数据下的锚点错位问题解决方法
2008/12/24 Javascript
Javascript WebSocket使用实例介绍(简明入门教程)
2014/04/16 Javascript
javascript中通过arguments参数伪装方法重载
2014/10/08 Javascript
JavaScript中的this关键字使用方法总结
2015/03/13 Javascript
url中的特殊符号有什么含义(推荐)
2016/06/17 Javascript
js图片轮播手动切换特效
2017/01/12 Javascript
微信小程序 开发之顶部导航栏实例代码
2017/02/23 Javascript
基于vue2的table分页组件实现方法
2017/03/20 Javascript
vue+vuex+axio从后台获取数据存入vuex实现组件之间共享数据
2017/04/22 Javascript
angular过滤器实现排序功能
2017/06/27 Javascript
详解vue 实例方法和数据
2017/10/23 Javascript
jQuery实现的中英文切换功能示例
2019/01/11 jQuery
js 将线性数据转为树形的示例代码
2019/05/28 Javascript
vue路由 遍历生成复数router-link的例子
2019/10/30 Javascript
基于js实现判断浏览器类型代码实例
2020/07/17 Javascript
如何阻止移动端浏览器点击图片浏览
2020/08/29 Javascript
基于python时间处理方法(详解)
2017/08/14 Python
python3+PyQt5实现自定义窗口部件Counters
2018/04/20 Python
Python实现快速傅里叶变换的方法(FFT)
2018/07/21 Python
Python远程视频监控程序的实例代码
2019/05/05 Python
基于Keras中Conv1D和Conv2D的区别说明
2020/06/19 Python
美国最大的香水出口:FragranceX.com
2017/11/04 全球购物
美国儿童珠宝在线零售商:Loveivy
2019/05/22 全球购物
大学运动会通讯稿
2014/01/28 职场文书
超市中秋节促销方案
2014/03/21 职场文书
寒暑假实习证明书模板
2014/11/29 职场文书
投资公司董事长岗位职责
2015/04/16 职场文书
第一节英语课开场白
2015/06/01 职场文书
暖春观后感
2015/06/08 职场文书
公司员工宿舍管理制度
2015/08/07 职场文书
2016年清明节期间群众祭祀活动工作总结
2016/04/01 职场文书
一文搞懂redux在react中的初步用法
2021/06/09 Javascript