将 ngfor 数据移到其标签之外答案

【问题标题】：moving ngfor data outside of it's tag将 ngfor 数据移到其标签之外
【发布时间】：2021-08-18 06:53:51
【问题描述】：

这是我第一次发布如此批评礼仪的帖子。

一直在离子项目中使用 *ngFor="let item of items" 但我遇到了一个问题，即一旦在 a 标签中使用 *ngFor，我不知道我可以为谁转换数据将所选项目放入包含它的原始标签之外的标签中。

代码：

<ion-list>
<div class="wrapper">
  <ion-item-group class="day" *ngFor="let day of Excursion_Schedule" >
    <ion-item-divider class="dayCard" (click)="day.displayItineraryFlag= !day.displayItineraryFlag"><ion-icon name="ios-arrow-forward" item-right></ion-icon>{{day.ExcSch_date | date:'dd'}}</ion-item-divider>
       <!-- CODE I WANT TO MOVE   --> <ng-container *ngIf="day.displayItineraryFlag">
      <div ion-item class="cardtitle" *ngFor="let place of day.Excursion_CustomRoadMap">
        <p>check</p>
          <ion-item-divider class="cardtitle" *ngIf="place.Exc_CustomRoadMap_Name" (click)="place.displayStationDetailsFlag= !place.displayStationDetailsFlag">
             <div class="textW">{{place.Description}} - {{place.Exc_CustomRoadMap_StartTime}}</div>
             <br>
             <div *ngIf="place.displayStationDetailsFlag">
              <div class="mapNpic">
                <img class="pics" src="{{place.Photo}}" alt="">
                <img class="pics" src="https://media-cdn.tripadvisor.com/media/photo-s/14/5f/96/77/nice-view-of-the-sunset.jpg" alt="">
              </div>

              <div class="dits">
                <br> <br>
                <h3>Adress</h3>
                <h3>Phone Number</h3>
                <h3>Email</h3>
                <h3>Website</h3>
                



              </div>

             </div>
          </ion-item-divider> 
      </div>
    </ng-container>
  </ion-item-group>
</div>
<p>
  TESTING 123
  <!-- PLACE WHERE I WANT TO MOVE ng-container TO   -->
</p>

【问题讨论】：

标签： html angular ionic-framework ngfor

【解决方案1】：

只需使用插值。为此，您必须将所选项目写入变量，然后将其插入外部区域。这是一个例子：

selectedItem: any;
Excursion_Schedule: Array<any> = [];

HTML

<div><span>{{selectedItem}}</span>
    
    <div *ngFor="let day of Excursion_Schedule">
        <!-- write the selected day into the local variable here -->
    </div>

</div>

【讨论】：