有什么方法可以连接两个不同的ngfo吗

Question

<div class="gl-w-100 gl-md-w-auto gl-po-rel list">
<div class="signin_wrpr gl-w-100 gl-po-rel gl-d-flex gl-fd-column gl-bg-white gl-lg-w-auto gl-md-w-auto gl-h-100 gl-md-ta-c">
<div class="head gl-fs-12 gl-lh-12 gl-fw-600 gl-ff-Raleway gl-lg-fs-14 gl-lg-lh-16 " *ngFor="let item of Listitems ;let i=index" >
<div class="gl-my-10 gl-py-10  gl-tt-u tab"  tabindex="1" > <span class="gl-pl-40 gl-md-pl-0  gl-py-10" >{{item}}</span></div>
<div class="gl-w-80 gl-m-auto bdr"></div>
</div>

</div>

</div>
<section class="gl-po-rel gl-md-w-auto gl-ml-30 gl-md-ml-0 gl-md-mt-20" >
<div class="signin_wrpr gl-w-100 gl-po-rel gl-d-flex gl-fd-column gl-bg-white gl-h-100" *ngFor="let p of myObj;let i= index">
<div class="head gl-fs-19 gl-lh-15 gl-fw-400 gl-ff-Raleway gl-lg-fs-16 gl-lg-lh-16">
<div class="gl-p-20 schemes"> {{p.Heading}}</div>
</div>
<div class="gl-po-rel gl-p-20 gl-ff-poppins gl-lg-fs-12 gl-lg-lh-24 gl-fs-15 gl-lh-30 gl-fw-300 gl-p-40 gl-md-p-20 gl-ta-j" >
{{p.Description}}
</div>
</div>
</section>
</div>

当点击项目列表中的第一个项目时，我只想显示myObj中的第一项。也就是说，如果我点击项目列表的第一项，相应的(索引(项目将显示在myObj 中

Answer 1

您可以跟踪组件中的索引并显示所选的索引数据。

示例

// component.ts
selectedIndex = 0; // To display first item
setIndex(i) {
this.selectedIndex = i
}

<div class="gl-w-100 gl-md-w-auto gl-po-rel list">
<div class="signin_wrpr gl-w-100 gl-po-rel gl-d-flex gl-fd-column gl-bg-white gl-lg-w-auto gl-md-w-auto gl-h-100 gl-md-ta-c">
<div class="head gl-fs-12 gl-lh-12 gl-fw-600 gl-ff-Raleway gl-lg-fs-14 gl-lg-lh-16 " *ngFor="let item of Listitems ;let i=index" (click)="setIndex(i)">
<div class="gl-my-10 gl-py-10  gl-tt-u tab"  tabindex="1" > <span class="gl-pl-40 gl-md-pl-0  gl-py-10" >{{item}}</span></div>
<div class="gl-w-80 gl-m-auto bdr"></div>
</div>

</div>

</div>
<section class="gl-po-rel gl-md-w-auto gl-ml-30 gl-md-ml-0 gl-md-mt-20" *ngIf="myObj[selectedIndex]" >
// myObj[selectedIndex].value // Do your stuff here
</section>