我正在使用 Angular 5,我有这个:
// app.component.ts
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
appendToContainer() {
// Do the stuff here
// Append PanelComponent into div#container
}
}
现在是app.component.html
// app.component.html
<button (click)="appendToContainer()"></button>
<div id="container"></div>
最后我有一个简单的组件
// panel.component.html
<div class="panelComponent">
This is a panel Component html
</div>
我想做的是,每次单击 app.component.html 上的按钮时,我都需要将 panel.component 附加到 app.component.html 中
我怎样才能做到这一点?
您可以使用 *ngFor 和变量来实现您想要的
//In your component
num:number=0
//You html like
<button (click)="num++"></button>
//we create a array "on fly" and slice to get only a "num" items
<div *ngFor="let item in [0,1,2,3,4,5,6,7,8,9].slice(0,num)" class="panelComponent">
This is a panel Component html
</div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)