Angular 2過濾器和切換功能不能按預期工作

我創建了一個漢堡菜單，並且有顯示子類別的切換功能，這個切換功能正常工作，直到我對它們應用過濾器。通過過濾器切換功能不能正常工作搜索某個類別後Angular 2過濾器和切換功能不能按預期工作

這是我的html代碼

<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>

在component.ts即時通訊使用此代碼切換功能

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

來源

2017-10-18 user1881845

鑑於該指數的變化計算toggleMenu函數索引 – learner

的index變量僅適用於當前的結果。所以當應用過濾器時，結果會發生變化，並且索引不會與數組中元素的實際位置相對應。

您可以通過類別本身到toggleMenu(category, catArray)函數，而不是指數，當施加濾波器和指數不與模型收集我猜符合使用catArray.indexOf(category)

來源

2017-10-18 10:28:41 learner

謝謝，我嘗試過，但得到錯誤無法讀取屬性顯示的未定義 – user1881845

你能否在這裏粘貼你的更新代碼或創建一個plunker出來？ – learner

toggleMenu（category，catArry）{index} = catArry.indexOf（category）; console.log（「Index Value」+ index）; （catArry [this.prevClicked] && this.prevClicked！== index）{ catArry [this.prevClicked] .show = false; } catArry [index] .show =！catArry [index] .show; this.prevClicked = index; } – user1881845

Angular 2過濾器和切換功能不能按預期工作

回答

相關問題