// 写法一: 
1 @Components({
2 ....,
3 inputs:['init'],
4 outputs:['finish']
5 })
6 export class xxx(){
7 okEvent: EventEmitter<any> = new EventEmitter();
8
9 ok(){
10 // this should match the type define in EventEmitter
11 this.okEvent.emit('the value want to pass');
12 }
13 }
14
15 // in another components
16 <ddd (finish)="finish($event)" [init]="value pass in"></ddd>
17
18 $event => will catch the return value
 1 // 另外一种写法:
2 import { Component, View, Input, Output, EventEmitter } from 'angular2/angular2';
3
4 @Components({
5 ....
6 })
7 export class xxx(){
8 @Input() init;
9 // @Output(alias name)
10 @Output('finish') okEvent:EventEmitter<Any> = new EventEmitter();
11
12
13 ok(){
14 // this should match the type define in EventEmitter if use typescript
15 this.okEvent.emit('the value want to pass');
16 }
17 }
18
19 // in another components
20 <ddd (finish)="finish($event)" [init]="value pass in"></ddd>
21
22 $event => will catch the return value

Angular中input和output使用的更多相关文章

  1. angular 的 @Input、@Output 的一个用法

    angular 使用 @input.@Output 来进行父子组件之间数据的传递. 如下: 父元素: <child-root parent_value="this is parent ...

  2. Angular2中Input和Output

    @Input @Input是用来定义模块的输入的,用来让父模块往子模块传递内容: @Output 子模块自定义一些event传递给父模块用@Output. 对于angular2中的Input和Outp ...

  3. [Angular] Testing @Input and @Output bindings

    Component: import { Component, Input, ChangeDetectionStrategy, EventEmitter, Output } from '@angular ...

  4. Java中的IO流,Input和Output的用法,字节流和字符流的区别

    Java中的IO流:就是内存与设备之间的输入和输出操作就成为IO操作,也就是IO流.内存中的数据持久化到设备上-------->输出(Output).把 硬盘上的数据读取到内存中,这种操作 成为 ...

  5. NET中调用存储过程(Output、Input)

    NET中调用存储过程(Output.Input) .NET中调用存储过程(Output.Input) 带输入输出参数的存储过程 带输入输出参数的存储过程 create procedure itemCo ...

  6. ParameterDirection中的参数(Input,Output,InputOutput,ReturnValue)

    ParameterDirection中的参数类型定义,首先看ParameterDirection定义 // 摘要: // 指定查询内的有关 System.Data.DataSet 的参数的类型. pu ...

  7. angular中父组件给子组件传值-@input

    1. 父组件调用子组件的时候传入数据 <app-header [msg]="msg"></app-header> 2. 子组件引入 Input 模块 imp ...

  8. angular源码分析:angular中jqLite的实现——你可以丢掉jQuery了

    一.从function JQLite(element)函数开始. function JQLite(element) { if (element instanceof JQLite) { //情况1 r ...

  9. Angular4学习笔记(六)- Input和Output

    概述 Angular中的输入输出是通过注解@Input和@Output来标识,它位于组件控制器的属性上方. 输入输出针对的对象是父子组件. 演示 Input 新建项目connInComponents: ...

随机推荐

  1. 讨论IM软件“网上假货’

    概要 网上假货.在不能使用网络的情况下,IM软件还显示在线. 网上是假的"在线--当前离线"之间的状态,在这段时期.用户无法发送消息.用户可以创建假冒网上心跳的错觉(点击了解).缓 ...

  2. cocos2d-x 源代码分析 : Ref (CCObject) 源代码分析 cocos2d-x内存管理策略

    从源代码版本号3.x.转载请注明 cocos2d-x 总的文件夹的源代码分析: http://blog.csdn.net/u011225840/article/details/31743129 1.R ...

  3. linux下一个rsync工具和配置

    本文介绍了整个基本:http://www.2cto.com/os/201308/238733.html 一些简单的备忘录: 1. ubuntu下通过apt-get就可以安装: 2. 配置文件/etc/ ...

  4. MVC EF 导航属性

    @model IQueryable<EFExam.Models.CategoryProductViewModel>@{    Layout = null;}<!DOCTYPE htm ...

  5. Win8 Metro(C#)数字图像处理--2.63图像指数增强

    原文:Win8 Metro(C#)数字图像处理--2.63图像指数增强  [函数名称]   指数增强      WriteableBitmap IndexenhanceProcess(Writea ...

  6. Android零基础入门第32节:新推出的GridLayout网格布局

    原文:Android零基础入门第32节:新推出的GridLayout网格布局 本期主要学习的是网格布局是Android 4.0新增的布局,和前面所学的TableLayout表格布局 有点类似,不过他有 ...

  7. 基于X.509证书和SSL协议的身份认证过程实现(OpenSSL可以自己产生证书,有TCP通过SSL进行实际安全通讯的实际编程代码)good

    上周帮一个童鞋做一个数字认证的实验,要求是编程实现一个基于X.509证书认证的过程,唉!可怜我那点薄弱的计算机网络安全的知识啊!只得恶补一下了. 首先来看看什么是X.509.所谓X.509其实是一种非 ...

  8. .NET Core整合log4net以及全局异常捕获实现2

    Startup代码 public static ILoggerRepository repository { get; set; } public Startup(IConfiguration con ...

  9. MongoDB对文档的操作

    插入文档 db.COLLECTION_NAME.insert({doc1},{doc2},...) e.g.:db.collection.insert({name:'123',age:12},{nam ...

  10. Python:Numpy学习

    import numpy as np # 基础属性 array = np.array([[[1,2,3], [0,0,1]], [[1,2,3], [0,0,1]]], dtype = np.int6 ...