角度2のフィルターとトグル機能が期待通りに機能しない

Question

ハンバーガーメニューを作成しましたが、サブカテゴリーを表示するトグル機能があります。このトグル機能はフィルターを適用するまで機能しています。フィルタトグル機能を使用してカテゴリを検索した後、機能しません。

これはcomponent.tsで

<ul class="nav navbar-nav"> 
<div id="menuToggle" class="sidenav"> 
<ul id="menu"> 
    <li> 
    <input class="form-control" type="search" [(ngModel)]="txtToSearch" placeholder="Search"/> 
    </li> 
    <li *ngFor="let category of (componentContents.dashboardMenu | dashboardFilter : txtToSearch); let i = index" > 
    <p class="toggleMenu" (click)="toggleMenu(i,componentContents.dashboardMenu)">{{category.category}} 
    </p> 

    <div *ngIf="category.show"> 
     <ul id="{{(category.category).split(' ').join('-')}}" *ngIf="category.subCategory.length > 0"> 
     <li *ngFor="let subCat of category.subCategory"> 
      <a routerLink={{subCat.router}} routerLinkActive="active">    
      <span class="glyphicon glyphicon-bell" ></span>{{subCat.subcategory}} </a></li> 
     </ul> 
    </div> 
    <hr /> 
    </li> 
</ul> 

はトグル機能

toggleMenu(index, catArry) { 
if (catArry[this.prevClicked] && this.prevClicked !== index) { 
    catArry[this.prevClicked].show = false; 
} 
catArry[index].show = !catArry[index].show; 
this.prevClicked = index; 
} 

Answer 1

index変数は、現在の結果に適用されるため、このコードを使用してイム私のhtmlコードです。したがって、フィルタが適用されると、結果は変化し、インデックスは配列内の要素の実際の位置に対応しません。

あなたが代わりにインデックスのtoggleMenu(category, catArray)関数にカテゴリ自体を渡すと、フィルタが適用され、インデックスがモデルコレクションと一致していない私が推測されたときにビューのcatArray.indexOf(category)