你需要使用*ngif,并有一个方法来更新任何更改时的选择,我想这就是你要找的,
changeA( aValue ) {
this.currentA = aValue;
this.aElem = this.currentA;
this.selectedMonthElem = this.currentA;
this.setSelection();
}
changeB( bValue ) {
this.currentB = bValue;
this.bElem = this.currentB;
this.selectedYearElem = this.currentB;
this.setSelection();
}
setSelection() {
this.selection = this.currentA + this.currentB;
}
<button #elem1 value="A1" (click)="changeA(elem1.value)">A1</button>
<button #elem2 value="A2" (click)="changeA(elem2.value)">A2</button>
<button #elem3 value="B1" (click)="changeB(elem3.value)">B1</button>
<button #elem4 value="B2" (click)="changeB(elem4.value)">B2</button>
<p *ngIf="selection == 'A1B1'">Paragraph For A1B1</p>
<p *ngIf="selection == 'A1B2'">Paragraph For A1B2</p>
<p *ngIf="selection == 'A2B1'">Paragraph For A2B1</p>
<p *ngIf="selection == 'A2B2'">Paragraph For A2B2</p>
您仍然可以在对象中包含段落内容,并使整个结构像地图一样。这样我们就不需要使用多个*ngif和硬编码。如果你喜欢这个解决方案,请告诉我
更新的工作代码:
https://stackblitz.com/edit/ngfor-example-ntnm1x
