import { Component, OnInit, EventEmitter, Output } from '@angular/core';

@Component({
selector: 'app-order-change',
templateUrl: './order-change.component.html',
styleUrls: ['./order-change.component.css']
})
export class OrderChangeComponent implements OnInit { name = 'IBM';
count: number;
@Output()
price: EventEmitter<Product> = new EventEmitter(); @Output()
priceA: EventEmitter<Product> = new EventEmitter(); constructor() { } ngOnInit() {
setInterval(() => {
const product = new Product(this.name, * Math.random());
this.count = product.price;
this.price.emit(product);
}, );
} sentPrice() {
this.priceA.emit(new Product(this.name, this.count * ));
}
} export class Product {
constructor(public name: string, public price: number) { }
}
<p>
买{{count | number:'2.1-4'}}手{{name}}产品
</p>
<button (click)="sentPrice()">点</button>
import { Component } from '@angular/core';
import { Product } from './order-change/order-change.component'; @Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent { orderName: string;
count: number; price: Product = new Product('', ); priceHandler(event: Product) {
this.price = event;
}
}
<app-order-change (priceA)="priceHandler($event)"></app-order-change>
<app-order [test]='price'></app-order>
import { Component, OnInit, Input } from '@angular/core';
import { Product } from '../order-change/order-change.component'; @Component({
selector: 'app-order',
templateUrl: './order.component.html',
styleUrls: ['./order.component.css']
})
export class OrderComponent implements OnInit { @Input()
orderName: string; @Input()
count: number; @Input()
test: Product; constructor() { } ngOnInit() { } }
<p>
买{{test.name}}手{{test.price}}产品
</p>
05-16 23:31
查看更多