[英]Return same html at multiple place without repeating same component selector angular 2+
你可以这样做。 为图块创建一个数组并设置数据。
tiles: Array<any> = [
{
title: 'Channel',
data: []
},
{
title: 'Campaign',
data: []
},
{
title: 'Region',
data: []
},
{
title: 'Product',
data: []
},
];
使用*ngFor
在HTML内部显示图块
<div *ngFor="let tile of tiles">
<tile-component [tileData]="tile"><tile-component>
</div>
在tile组件内部,您需要执行此操作;
导入输入以从父组件获取输入数据
import { Component, OnInit, Input} from '@angular/core';
@Input() tileData;
在您的tile组件html中执行此操作
<h4>{{tileData['title']}}<h4>
<p *ngIf="tileData['data'].length == 0">No data available</p>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.