demo

1.demo结构 <inventory-app> || //传入数组 <product-list> || //进行迭代,并显示 <product-row> || 每个商品的badage,又可以拆分成图片,部门,价格等组件。 2. 输出属性,@Output装饰器 这个装饰器用于向其它组件发射数据,常配合eventEmitter使用。 在本demo中,组件先声明一个输出属性: @Output onProductSelected:EventEmtter(); 然后在构造函数中生成(new)一个发射器: 组件中是通过click()事件函数来发送被选中的product;最后使用onProductSelected.emit(product)发射出去。 然后,在组件的html模板中, <rec-comp>标签表示是发送数据的目标组件,因为使用的是click方法,因此(click)=’clicked(productChoosed)’ click是一个内置方法,当点击某个元素(row)时。就调用列表组件中的clicked(produtChoosed)方法,发射数据到根组件, 根组件: <product-list [products]=’products’ (onProductelected)=’productWasSelected($event)’>…