angular2父子组件传值
1: 父组件想子组件传值——@Input
ng2的父组件向子组件传值主要用的是@Input声明其输入属性;首先在父组件用import导入数据,这里为了方便直接在父组件里面写了,最好是从外部导入,这样代码感觉整洁一些;
第二步: <ctaf-cp-slider [info]="data" ></ctaf-cp-slider> 在父组件的templateUrl模板里给子组件的选择器加上要传入的值,这里的data就是刚才在ts导入的数据;
第三步:在子组件的ts里导入input;
第四步:在子组件类里声明输入属性————@Input() info: Array<Object>
第五步:在子组件模板里使用从父组件引入的值,
2: 子组件向父组件传值
ng2组件可以使用EventEmitter对象分发自定义事件。首先在子组件导入Output;
第二步:在子组件类里定义一个EventEmitter对象,它能够向父组件触发事件;
第三步: 在模板中写一个方法,
第四步: 在上一步的方法里用emit()方法发射事件
第五步: 在父组件模板里子组件选择器上接收子组件传过来的值
第六步:在父组件里处理传过来的值