Question

几个月前，我已经开始从事Ionic的研究，我发现很难实施手风琴清单。

我想在单击主类别时打开子类别。我想单击一次，但是需要双击才能打开列表。

这是我的html：

<div *ngFor="let d of SubCategories">
<div class="accordion" (click)="abcd(d)">   //Here is click I assigned to open the sublist
<ion-item>
    <ion-label>{{d.name}}</ion-label>
    <ion-checkbox [ngModel]="pepperoni"></ion-checkbox>
  </ion-item>
</div>

<div class="panel">
<ion-item *ngFor="let e of SubCategories1"> 
    <ion-label>{{e.name}}</ion-label>
    <ion-checkbox [ngModel]="pepperoni"></ion-checkbox>
</ion-item>
</div>
</div>

我的打字稿文件：

abcd(data){
    console.log(data.id);
    this.abcde = data.id;
    this.CatAndSubCat1();
    var acc = document.getElementsByClassName("accordion");
    var i;
    for (i = 0; i < acc.length; i++) {
        acc[i].addEventListener("click", function() {        //this assigns a click again which opens the list after than.so the sub list opens after 2 clicks
            this.classList.toggle("active");
            var panel = this.nextElementSibling;
            if (panel.style.maxHeight){
                panel.style.maxHeight = null;
            } else {
                panel.style.maxHeight = panel.scrollHeight + "px";
            }
        });
    }
}

我要单击打开子列表。

谢谢。

Answer 1

这是Ionic框架本身的未解决问题，有可用的修复程序，但不确定是否能解决您的问题。让我们尝试一下。

添加（点击）而不是（点击）或
在您的SCSS文件中添加以下类

.input-cover {显示：无； }

打开手风琴的离子点击事件需要双击图标

1 个答案: