// 写法一: 
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. Python 函数调用性能记录

    之前用 JS 写项目的时候,项目组用的组件模式,一直感觉很不错.最近用 Python 做新项目,项目结构也延续了组件模式.一直没有对函数调用的性能作了解,今天突发奇想测试了一下,写了一些测试代码 首先 ...

  2. 的二分图poj2446

    称号:id=2446">poj2446 意甲冠军:给定一个m*n矩阵,在有些地方坑,然后1*2本文叠加,反复.可以把出了坑的地方其它所有覆盖的话输出YES,否则NO 分析:有一道二分图 ...

  3. Qt使用预编译头文件Using Precompiled Headers(提升10倍以上)

    预编译头文件是被很多编译器用来编译稳定的代码以及将编译好的稳定代码存储在二进制文件中用于提升编译性能.在随后的编译中,编译器将加载存储状态继续编译指定的文件.每一个随后的编译将更快,因为稳定的代码不需 ...

  4. ASP.NET Core SameSite 设置引起 Cookie 在 QQ 浏览器中不起作用

    最近在发布了基于 ASP.NET Core 实现的新版登录页面之后,陆陆续续地接到用户反馈登录时 Antiforgery Token 总是验证失败. 日志中记录的对应错误是 Antiforgery t ...

  5. WPF中INotifyPropertyChanged用法与数据绑定

    在WPF中进行数据绑定的时候常常会用到INotifyPropertyChanged接口来进行实现,下面来看一个INotifyPropertyChanged的案例. 下面定义一个Person类: usi ...

  6. js onload事件使用

    <!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...

  7. WPF扩展标记X:STATIC

    原文:WPF扩展标记X:STATIC public class XStaic     {         public static string Content = "确定"; ...

  8. cordova-plugin-local-notifications发送Android本地消息

    原文:cordova-plugin-local-notifications发送Android本地消息 1.GitHub源代码地址: https://github.com/katzer/cordova- ...

  9. js 跨域访问 获取验证码图片 获取header 自定义属性

    1.net core web api 后端 /// <summary> /// 图形验证码 /// </summary> [HttpGet] public IActionRes ...

  10. OWIN 托管服务器问题:StartOptions WebApp.Start TargetInvocationException

    我有一个与OWIN托管的服务器有一个小问题.我试图让它可以访问本地网络,这意味着我不得不添加一些额外的选择: // Start OWIN host StartOptions options = new ...