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();
constructor() { }
ngOnInit() {
setInterval(() => {
const product = new Product(this.name, 100 * Math.random());
this.count = product.price;
this.price.emit(product);
}, 1000);
}
}
export class Product {
constructor(public name: string, public price: number) { }
}
<p>
买{{count | number:'2.1-4'}}手{{name}}产品
</p>
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('', 0);
priceHandler(event: Product) {
this.price = event;
}
}
<app-order-change (price)="priceHandler($event)"></app-order-change>
{{price.name}}
{{price.price | number : '2.1-4'}}