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

 更新时间:2018年10月08日 11:01:55   作者:zhenghao35791  
今天小编就为大家分享一篇angular中子控制器向父控制器传值的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

如下所示:

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中子控制器向父控制器传值的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • Angular环境搭建及简单体验小结

    Angular环境搭建及简单体验小结

    Angular基于TypeScript和react、vue相比 Angular更适合中大型企业级项目,本文通过实例代码给大家分享Angular环境搭建及简单体验,感兴趣的朋友跟随小编一起学习吧
    2021-05-05
  • AngularJs根据访问的页面动态加载Controller的解决方案

    AngularJs根据访问的页面动态加载Controller的解决方案

    这篇文章主要介绍了AngularJs根据访问的页面动态加载Controller的解决方案,需要的朋友可以参考下
    2015-02-02
  • 浅谈angular4实际项目搭建总结

    浅谈angular4实际项目搭建总结

    本篇文章主要介绍了浅谈angular4实际项目搭建总结,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-12-12
  • angular1.x ui-route传参的三种写法小结

    angular1.x ui-route传参的三种写法小结

    今天小编就为大家分享一篇angular1.x ui-route传参的三种写法小结,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08
  • AngularJS入门教程之表格实例详解

    AngularJS入门教程之表格实例详解

    本文主要介绍AngularJS 表格,这里给大家整理了相关知识,并附代码实例,有需要的小伙伴可以参考下
    2016-07-07
  • AngularJS中过滤器的使用与自定义实例代码

    AngularJS中过滤器的使用与自定义实例代码

    这篇文章运用实例代码给大家介绍了angularjs中过滤器的使用和自定义过滤器,对大家学习AngularJS具有一定的参考借鉴价值,感兴趣的朋友们可以参考借鉴。
    2016-09-09
  • angular.js中解决跨域问题的三种方式

    angular.js中解决跨域问题的三种方式

    跨域,前端开发中经常遇到的问题,下面这篇文章主要给大家介绍了关于angular.js中解决跨域问题的三种方式,文中介绍的非常详细,对大家具有一定的参考学习价值,需要的朋友们下面跟着小编一起来学习学习吧。
    2017-07-07
  • angularJs 表格添加删除修改查询方法

    angularJs 表格添加删除修改查询方法

    下面小编就为大家分享一篇angularJs 表格添加删除修改查询方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-02-02
  • Angular6 Filter实现页面搜索的示例代码

    Angular6 Filter实现页面搜索的示例代码

    这篇文章主要介绍了Angular6 Filter实现页面搜索的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-12-12
  • AngularJS变量及过滤器Filter用法分析

    AngularJS变量及过滤器Filter用法分析

    这篇文章主要介绍了AngularJS变量及过滤器Filter用法,结合实例形式分析了AngularJS变量、过滤器及自定义过滤器的相关用法与注意事项,需要的朋友可以参考下
    2016-11-11

最新评论