app.component.ts
import { Component } from "@angular/core";
@Component({
selector: "app-root",
templateUrl: "./app.component.html",
styleUrls: ["./app.component.css"]
})
export class AppComponent {
title = "app";
stock = ""
}
app.component.html
<h1></h1>
<div></div>
<div>
<input type="text" placeholder="" [(ngModel)]="stock">
<app-order [stockCode]="stock" [amount]="100"></app-order>
</div>
order.component.ts
import { Component, OnInit, Input} from "@angular/core";
@Component({
selector: "app-order",
templateUrl: "./order.component.html",
styleUrls: ["./order.component.css"]
})
export class OrderComponent implements OnInit {
@Input()
stockCode:string;
@Input()
amount: number
constructor() { }
ngOnInit() {
}
}
order.component.html
<div>
</div>
<div>
{{amount}}{{stockCode}}
</div> 