一、父模块向子模块传值

//父html
<my-child [childdata]="parentdata"></my-child>

其中,my-child为子模块的selector标签,childdata为子模块声明的变量(用来保存父模块传递过来的值),parentdata为父模块声明的变量(保存着父模块的值)

子模块中引用父模块传过来的值:

//child.component.ts
import { Component, OnInit,Input } from '@angular/core'; @component({
selector:'my-child',
...
})
export class ChildComponent implements OnInit{
@Input() childdata:any;
//Do some action with childdata
}

二、子模块向父模块传递事件

子模块传出事件:

//child.component.ts
import { Component, OnInit,Output } from '@angular/core'; @component({
selector:'my-child',
...
})
export class ChildComponent implements OnInit{
@OUtput() childevent=new EventEmitter();
//Do some action
}

父html引用事件:

<my-child (childevent)="parentevent($event)"></my-child>

其中childevent为子模块事件,parentevent为父模块事件

ng2父子模块数据交互的更多相关文章

  1. 分布式环境中,模块数据交互协议分析 (百度brpc)

    1. 背景 之前听到同事说,要为自己的模块考虑写个数据协议.今天有空想了一下.写出来,方便后续使用. 开源代码brpc中可以支持多种协议,nshead.redis.mongo等20多种协议. 2. 什 ...

  2. ng2父子模块通信@ViewChild和@Inject

    一.@ViewChild 父组件中使用@ViewChild拿到子组件的变量和方法(父组件可调用子组件的方法和变量) parent.component.ts: import { Component, O ...

  3. vue20 父子组件数据交互

    子组件使用父组件数据 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...

  4. Vue2.0父子组件之间和兄弟组件之间的数据交互

    熟悉了Vue.js的同级组件之间通信,写此文章,以便记录. Vue是一个轻量级的渐进式框架,对于它的一些特性和优点,请在官网上进行查看,不再赘述. 使用NPM及相关命令行工具初始化的Vue工程,目录结 ...

  5. vuejs组件交互 - 01 - 父子组件之间的数据交互

    父子组件之间的数据交互遵循: props down - 子组件通过props接受父组件的数据 events up - 父组件监听子组件$emit的事件来操作数据 示例 子组件的点击事件函数中$emit ...

  6. angularJS中directive父子组件的数据交互

    angularJS中directive父子组件的数据交互 1. 使用共享 scope 的时候,可以直接从父 scope 中共享属性.使用隔离 scope 的时候,无法从父 scope 中共享属性.在 ...

  7. 【python】-- 多进程的基本语法 、进程间数据交互与共享、进程锁和进程池的使用

    多进程 进程之间是相互独立的,python是启动进程的时候,是启动的是原生进程.进程是没有GIL锁的,而且不存在锁的概念,进程之间的数据式不能共享的,而线程是可以的. 1.进程的定义 用mulipro ...

  8. AngularJs $resource 高大上的数据交互

    $resource 创建一个resource对象的工厂函数,可以让你安全的和RESFUL服务端进行数据交互. 需要注入 ngResource 模块.angular-resource[.min].js ...

  9. angularJs中自定义directive的数据交互

    首先放官方文档地址:https://docs.angularjs.org/guide/directive 就我对directive的粗浅理解,它一般用于独立Dom元素的封装,应用场合为控件重用和逻辑模 ...

随机推荐

  1. win732 安装hadoop

    windows下安装hadoop http://www.cnblogs.com/coder2012/archive/2013/05/25/3096631.html硬盘格式应为NTFS1 下载安装 Cy ...

  2. mac os x升级MOUNTAIN LION后svn command not found的解决

    因为svn是个开发工具 所以苹果把他移到 Xcode developer package 里 去了,所以你没装xcode之类的,先去AppStore把xcode装了   装好之后sudo vi /et ...

  3. JBossWeb/Tomcat 初始化连接器和处理 Http 请求过程

    概述 JBossWeb 是JBoss 中的 Web 容器.他是对 Tomcat 的封装,本文以 Http 连接器为例.简单说明 JBossWeb/Tomcat 初始化连接器和处理 Http 请求过程 ...

  4. “volatile”这个关键字

    我们经常使用“volatile”这个关键字,它是什么意思? 解析:volatile问题.当一个对象的值可能会在编译器的控制或监测之外被改变时,例如一个被系统时钟更新的变量,那么该对象应该声明成vola ...

  5. 网卡配置bond

    在实际的生产环境中,服务器都需要配置bond环境的,以提高安全性及均衡能力.我公司网卡配置的是mode=1 类型,mode=1 是主备模式,当其中一块网卡不能工作时,另一块网卡立即代替.以下是mode ...

  6. EasyNVR RTSP转RTMP-HLS流媒体服务器前端构建之:通过接口获取实时信息

    对于动态网站,要实时更新网站的信息,通过接口来获取实时信息是一个必不可少的部分.EasyNVR可以接入IPC等前端设备,必须要实时获取到对应的IPC实时信息进行展示. 本篇主要说明Ajax来获取数据. ...

  7. winform学习

    1:http://www.cnblogs.com/yieryi/category/704334.html 系列文章 2:http://www.easyicon.net/iconsearch/login ...

  8. JSP&Servlet(转)

    第一篇:Web应用基础1.概念:  1.1应用程序分类     a.桌面应用程序:一般是指采用client/server即客户机/服务器结构的应用程序.     b.web应用程序:一般是指采用Bro ...

  9. CUDA: 常量内存与事件

    常量内存: 常量内存用于保存在核函数执行期间不会发生变化的数据,在变量面前添加  __constant__  修饰符: __constant__  Sphere  s[SPHERES]; cudaMe ...

  10. history显示历史操作记录,并显示操作时间

    在查看历史的操作记录有两种方式1.在用户的目录下的.bash_history文件中[root@node1 ~]# vi ~/.bash_history rebootvi /etc/sysconfig/ ...