angular2组件通信
父到子
父组件:
ts部分:
@Component({
selector: 'app-info',
templateUrl: './info.component.html',
styleUrls: ['./info.component.css'],
})
export class InfoComponent implements OnInit { num:number = ; constructor() { }
changeNum(){
this.num++;
} } 模板部分:
<button (click)="changeNum()">传递给子组件</button>
<app-child [content]="num"></app-child> 子组件:
ts部分:
@Input() content:number;
模板部分:
<p>{{ content }}</p>
子到父
父组件
public how : string = "how";
getDate(str:string){
this.how = str;
} <app-list (updateNumber)="getDate($event)"></app-list> 子组件
impress(str:string){
let data = str;
this.updateNumber.emit(data)
} <ul>
<li *ngFor="let item of items" (click)="impress(item)">{{ item }}</li>
</ul>
angular2组件通信的更多相关文章
- Angular2 组件通信
1. 组件通信 我们知道Angular2应用程序实际上是有很多父子组价组成的组件树,因此,了解组件之间如何通信,特别是父子组件之间,对编写Angular2应用程序具有十分重要的意义,通常来讲,组件之间 ...
- 三大前端框架(react、vue、angular2+)父子组件通信总结
公司业务需要,react.vue.angular都有接触[\无奈脸].虽然说可以拓展知识广度,但是在深度上很让人头疼.最近没事的时候回忆各框架父子组件通信,发现很模糊,于是乎稍微做了一下功课,记录于此 ...
- angular2+ 组件间通信
angular2+ 不同于react的redux,vue的vuex,angular2+其实可实现数据状态管理的方法很多,以下方案一般也足够支撑普通业务: 父子组件通信 1.1 父组件向子组件传递信息( ...
- angular2 组件交互
1. 组件通信 我们知道Angular2应用程序实际上是有很多父子组价组成的组件树,因此,了解组件之间如何通信,特别是父子组件之间,对编写Angular2应用程序具有十分重要的意义,通常来讲,组件之间 ...
- angular5 组件通信(一)
用了两年angular1,对1的组件通信比较熟练,最直接的就是直接使用scope的父子节点scope就可以实现,且基本都是基于作用域实现的通信:还有就是emit,broadcast,on这几个东西了. ...
- 关于React的父子组件通信等等
//==================================================此处为父子组件通信 1.子组件调用父组件: 父组件将子组件需要调用方法存入props属性内,子组 ...
- Angular2 组件
1. 组件说明 Angular2 组件是构成Angular2应用程序的核心部分,Angualr2应用程序本质上来说就是一个组件树,Angular2组件一般由模块,注解,元数据以及组件类组成,实现组件类 ...
- vue.js入门(3)——组件通信
5.2 组件通信 尽管子组件可以用this.$parent访问它的父组件及其父链上任意的实例,不过子组件应当避免直接依赖父组件的数据,尽量显式地使用 props 传递数据.另外,在子组件中修改父组件的 ...
- Intent进行组件通信的一些体会
Intent进行组件通信的原理 l Intent协助应用间的交互与通讯 Intent负责对应用中一次操作的动作.动作涉及数据.附加数据进行描述.Android则根据此Intent的描述,负责找到对应 ...
随机推荐
- java关键字(详解)
目录 1. 基本类型 1) boolean 布尔型 2) byte 字节型 3) char 字符型 4) double 双精度 5) float 浮点 6) int 整型 7) long 长整型 8) ...
- java中常见异常汇总(根据自己遇到的异常不定时更新)
1.java.lang.ArrayIndexOutOfBoundsException:N(数组索引越界异常.如果访问数组元素时指定的索引值小于0,或者大于等于数组的长度,编译程序不会出现任何错误,但运 ...
- JavaScript 执行环境 与 变量对象
什么是JS的执行环境? function funA(){ //一段代码静静的躺在这里,不能叫执行环境 } funA(); //当代码开始执行以后,系统会将它存入执行栈,并为他准备好足够的内存空间使用 ...
- 将dubbo框架里的服务提供者迁移进k8s里,以docker提供服务时要注意的细节
在将dubbo框架里的服务提供者迁移进k8s时,有几个注意事项: 1, 要为默认情况下,dubbo会将k8s里的pod ip地址作为注册服务的地址,所以这个地址需要被改写(ip测试过,行得通,而dns ...
- pymongo的一些操作
参考:http://www.yiibai.com/mongodb/mongodb_drop_collection.html http://www.cnblogs.com/zhouxuchen/p/55 ...
- 查找无序数组中第K大的数
思路: 利用快速排序的划分思想 可以找出前k大数,然后不断划分 直到找到第K大元素 代码: #include <iostream> #include <algorithm> # ...
- 【U3D】播放器设置(PlayerSettings)
播放器设置 (Player Settings) 播放器设置 (Player Settings) 用于为您要在 Unity 中编译的最终游戏定义各项(特定于平台的)参数.例如,参数中的一些值用于您打开单 ...
- 【SQL SERVER】触发器(一)
下面是个人对触发器知识的整理,触发器其实很简单,但想要编写发杂的触发器操作还是需要一定的SQL语句编写,触发器主要用于SQL SERVER约束.默认值和规则的完整性检查,还可以实现由主键和外键不能保证 ...
- SQL Server 执行计划分析
当一个查询到达数据库引擎时,SQL Server执行两个主要的步骤来产生期望的查询结果: 第一步:查询编译,生成查询计划. 第二步:执行这个查询计划. 1. 用于演示分析执行计划的查询语句 /* 查询 ...
- Python类总结-描述符__get__(),__set__(),__delete__()
1 描述符是什么:描述符本质就是一个新式类,在这个新式类中,至少实现了__get__(),set(),delete()中的一个,这也被称为描述符协议 get():调用一个属性时,触发 set():为一 ...