1.父傳子 （@input）
parent.ts:
export class ParentPage {
?menu:'菜單';
? }
parent.html:
? <page-child [childMenu] = 'menu'></page-child>
child.ts:
import{Component,Input} from '@angular/core';
export class ChildPage{
@Input() childMenu:string;
}
child.html:
<div>{{childMenu}}</div>
? 2.子傳父 （@Output）child.ts:
import { Component, EventEmitter, Output }from'@angular/core';
export class ChildPage {
? @Output() changeNumber: EventEmitter =new EventEmitter();
? Number: number =0;
? constructor() {
? ? this.changeNumber.emit(this.Number+10)
? }
}
parent.html:
<h2>{{num}}</h2>
<page-child (changeNumber)="newNumber($event)"></page-child>
parent.ts:
export class ParentPage {
? num: number =0;
? newNumber(num:number){
? ? ? this.num= num;
? }
}
