Angular中input和output使用
// 写法一:
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使用的更多相关文章
- angular 的 @Input、@Output 的一个用法
angular 使用 @input.@Output 来进行父子组件之间数据的传递. 如下: 父元素: <child-root parent_value="this is parent ...
- Angular2中Input和Output
@Input @Input是用来定义模块的输入的,用来让父模块往子模块传递内容: @Output 子模块自定义一些event传递给父模块用@Output. 对于angular2中的Input和Outp ...
- [Angular] Testing @Input and @Output bindings
Component: import { Component, Input, ChangeDetectionStrategy, EventEmitter, Output } from '@angular ...
- Java中的IO流,Input和Output的用法,字节流和字符流的区别
Java中的IO流:就是内存与设备之间的输入和输出操作就成为IO操作,也就是IO流.内存中的数据持久化到设备上-------->输出(Output).把 硬盘上的数据读取到内存中,这种操作 成为 ...
- NET中调用存储过程(Output、Input)
NET中调用存储过程(Output.Input) .NET中调用存储过程(Output.Input) 带输入输出参数的存储过程 带输入输出参数的存储过程 create procedure itemCo ...
- ParameterDirection中的参数(Input,Output,InputOutput,ReturnValue)
ParameterDirection中的参数类型定义,首先看ParameterDirection定义 // 摘要: // 指定查询内的有关 System.Data.DataSet 的参数的类型. pu ...
- angular中父组件给子组件传值-@input
1. 父组件调用子组件的时候传入数据 <app-header [msg]="msg"></app-header> 2. 子组件引入 Input 模块 imp ...
- angular源码分析:angular中jqLite的实现——你可以丢掉jQuery了
一.从function JQLite(element)函数开始. function JQLite(element) { if (element instanceof JQLite) { //情况1 r ...
- Angular4学习笔记(六)- Input和Output
概述 Angular中的输入输出是通过注解@Input和@Output来标识,它位于组件控制器的属性上方. 输入输出针对的对象是父子组件. 演示 Input 新建项目connInComponents: ...
随机推荐
- 好记性不如烂笔头88-spring3学习(9)-schema的配置的解读和说明
Spring1使用了DTD格式,spring2以后使用的是schema的格式:使用schema的格式,支持了不同类型的配置拥有了自己的命名空间,让配置文件有了更加好的扩展性. 不论什么事情,都是有利有 ...
- 微信小程序--实现图片上传
前端: 微信开发者工具 后端:.Net 服务器:阿里云 这里介绍微信小程序如何实现上传图片到自己的服务器上 前端代码 data: { productInfo: {} }, //添加Banner bin ...
- 关于 Facebook 的 React 专利许可证
本文转载自:酷 壳 – CoolShell 作者:陈皓 随着 Apache.百度.Wordpress 都在和 Facebook 的 React.js 以及其专利许可证划清界限,似乎大家又在讨论 Fac ...
- WPF旋转的界面实现
原文:WPF旋转的界面实现 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/yangyisen0713/article/details/1821534 ...
- 关于 Swift 中的 Array.contains 方法
Swift 2.0 中对语言进行了又一次的改进,这次将整个语言变得更加面向对象化,比如在 Swift 1.x 中如果要判断某个元素是否在数组中,就需要用到 contains 函数: if contai ...
- socket 主机地址相关的函数
#include <arpa/inet.h> int inet_aton (const char *name, struct in_addr *addr) 将ipv4地址从数字点的形式转化 ...
- WPF Layout 系统概述——Measure
原文:WPF Layout 系统概述--Measure 前言 在WPF/Silverlight当中,如果已经存在的Element无法满足你特殊的需求,你可能想自定义Element,那么就有可能会面临重 ...
- QT 自定义消息(超级简单的一个例子)
#define TEST_EVENT QEvent::User + 100 class CVxActuatorMain : public QMainWindow { protected: ...
- Win10《芒果TV》更新v3.8.0初夏版:全新视觉体验,即刻分享视频
历时半年多昼夜,千呼万唤始出来,Win10版<芒果TV>全平台同步更新初夏版v3.8.0,统一视觉体验,完善分享投屏,进一步提升使用体验. Win10版<芒果TV>V3.8.0 ...
- 使用VC2005编译真正的静态Qt程序 good
首先,你应该该知道什么叫静态引用编译.什么叫动态引用编译.我这里只是简单的提提,具体的可以google一下. 动态引用编译,是指相关的库,以dll的形式引用库.动态编译的Exe程序尺寸比较小,因为相关 ...