javascript - 单击按钮时打开所有 Ion Item Sliding

Question

根据屏幕截图附件，当我触发 div 中的编辑按钮时，我希望所有滑动的离子项目一起打开，

目前它只滑出第一个删除离子项目，其他项目保持未打开状态。

这是我的代码

HTML

  <div class="editcontainer1" (click)="trigger()">Edit</div>

 <ion-item-group *ngFor="let p of cart" #myItemsId > 

    <ion-item-sliding  #slidingItem  lines="none">

      <div class="maincontainer">
        <ion-item>
        </ion-item>


        <ion-item-options side="end">
          <ion-item-option color="danger" 
     (click)="removeCartItem(p)">
            <div style="color: seashell;">Delete</div>
          </ion-item-option>
        </ion-item-options>
      </div>

    </ion-item-sliding>
  </ion-item-group>
   

TS

trigger() {
  this.itemSlidingList.open('end');
}
else {
  this.itemSlidingList.close();
}

我如何修改成为打开所有？

 openAllSlides(item) {
let a = Array.prototype.slice.call(item.el.children)
a.map((val) => {
  val.open();
})
 }

谢谢你。

截屏

Answer 1

您可以执行以下操作：

    <ion-list>
            <ion-item-group #myItemsId>  <!-- use ITEM id for group  -->
                <ion-item-sliding *ngFor="let item of items">
                    <ion-item>
                      <ion-label>Item Options</ion-label>
                    </ion-item>
                    <ion-item-options side="end">
                      <ion-item-option >Unread</ion-item-option>
                    </ion-item-options>         
                </ion-item-sliding>
            </ion-item-group>
        </ion-list>
<ion-button (click)="openAllSlides(myItemsId)">open all slides</ion-button>

.ts

openAllSlides(item){
      let a = Array.prototype.slice.call( item.el.children )
      a.map((val)=>{
        val.open();
      })
  }