Added TrackBy in main menu

This commit is contained in:
Vladyslav_Prykhodko 2020-09-15 11:14:43 +03:00
parent 6a4c2791b3
commit 3adbb94e06
4 changed files with 11 additions and 2 deletions

View File

@ -24,7 +24,7 @@
[ngClass]="{'tb-toggled' : sectionActive()}"></span> [ngClass]="{'tb-toggled' : sectionActive()}"></span>
</a> </a>
<ul id="docs-menu-{{section.name | nospace}}" class="tb-menu-toggle-list" [ngStyle]="{height: sectionHeight()}"> <ul id="docs-menu-{{section.name | nospace}}" class="tb-menu-toggle-list" [ngStyle]="{height: sectionHeight()}">
<li *ngFor="let page of section.pages"> <li *ngFor="let page of section.pages; trackBy: trackBySectionPages">
<tb-menu-link [section]="page"></tb-menu-link> <tb-menu-link [section]="page"></tb-menu-link>
</li> </li>
</ul> </ul>

View File

@ -44,4 +44,8 @@ export class MenuToggleComponent implements OnInit {
return '0px'; return '0px';
} }
} }
trackBySectionPages(index: number, section: MenuSection){
return section.name;
}
} }

View File

@ -16,7 +16,7 @@
--> -->
<ul fxFlex fxLayout="column" fxLayoutAlign="start stretch" class="tb-side-menu"> <ul fxFlex fxLayout="column" fxLayoutAlign="start stretch" class="tb-side-menu">
<li *ngFor="let section of menuSections$| async" [ngSwitch]="section.type === 'link'"> <li *ngFor="let section of menuSections$ | async; trackBy: trackByMenuSection" [ngSwitch]="section.type === 'link'">
<tb-menu-link *ngSwitchCase="true" [section]="section"></tb-menu-link> <tb-menu-link *ngSwitchCase="true" [section]="section"></tb-menu-link>
<tb-menu-toggle *ngSwitchCase="false" [section]="section"></tb-menu-toggle> <tb-menu-toggle *ngSwitchCase="false" [section]="section"></tb-menu-toggle>
</li> </li>

View File

@ -16,6 +16,7 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { MenuService } from '@core/services/menu.service'; import { MenuService } from '@core/services/menu.service';
import { MenuSection } from '@core/services/menu.models';
@Component({ @Component({
selector: 'tb-side-menu', selector: 'tb-side-menu',
@ -29,6 +30,10 @@ export class SideMenuComponent implements OnInit {
constructor(private menuService: MenuService) { constructor(private menuService: MenuService) {
} }
trackByMenuSection(index: number, section: MenuSection){
return section.name;
}
ngOnInit() { ngOnInit() {
} }