mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2024-10-30 01:08:47 +00:00
(FuseNavigation) Fixed: If [routerLinkActiveOptions] is "undefined" initially, router throws an error and stops working
This commit is contained in:
parent
8524df013a
commit
eca618c95b
|
@ -11,7 +11,7 @@
|
|||
[ngClass]="{'fuse-horizontal-navigation-item-active-forced': item.active}"
|
||||
[routerLink]="[item.link]"
|
||||
[routerLinkActive]="'fuse-horizontal-navigation-item-active'"
|
||||
[routerLinkActiveOptions]="item.isActiveMatchOptions">
|
||||
[routerLinkActiveOptions]="isActiveMatchOptions">
|
||||
<ng-container *ngTemplateOutlet="itemTemplate"></ng-container>
|
||||
</div>
|
||||
|
||||
|
@ -39,7 +39,7 @@
|
|||
[ngClass]="{'fuse-horizontal-navigation-item-active-forced': item.active}"
|
||||
[routerLink]="[item.link]"
|
||||
[routerLinkActive]="'fuse-horizontal-navigation-item-active'"
|
||||
[routerLinkActiveOptions]="item.isActiveMatchOptions"
|
||||
[routerLinkActiveOptions]="isActiveMatchOptions"
|
||||
(click)="item.function(item)">
|
||||
<ng-container *ngTemplateOutlet="itemTemplate"></ng-container>
|
||||
</div>
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnDestroy, OnInit } from '@angular/core';
|
||||
import { IsActiveMatchOptions } from '@angular/router';
|
||||
import { Subject } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { FuseHorizontalNavigationComponent } from '@fuse/components/navigation/horizontal/horizontal.component';
|
||||
|
@ -17,6 +18,7 @@ export class FuseHorizontalNavigationBasicItemComponent implements OnInit, OnDes
|
|||
@Input() item: FuseNavigationItem;
|
||||
@Input() name: string;
|
||||
|
||||
isActiveMatchOptions: IsActiveMatchOptions;
|
||||
private _fuseHorizontalNavigationComponent: FuseHorizontalNavigationComponent;
|
||||
private _unsubscribeAll: Subject<any> = new Subject<any>();
|
||||
|
||||
|
@ -29,6 +31,11 @@ export class FuseHorizontalNavigationBasicItemComponent implements OnInit, OnDes
|
|||
private _fuseUtilsService: FuseUtilsService
|
||||
)
|
||||
{
|
||||
// Set the equivalent of {exact: false} as default for active match options.
|
||||
// We are not assigning the item.isActiveMatchOptions directly to the
|
||||
// [routerLinkActiveOptions] because if it's "undefined" initially, the router
|
||||
// will throw an error and stop working.
|
||||
this.isActiveMatchOptions = this._fuseUtilsService.subsetMatchOptions;
|
||||
}
|
||||
|
||||
// -----------------------------------------------------------------------------------------------------
|
||||
|
@ -40,16 +47,20 @@ export class FuseHorizontalNavigationBasicItemComponent implements OnInit, OnDes
|
|||
*/
|
||||
ngOnInit(): void
|
||||
{
|
||||
// If the item doesn't have "isActiveMatchOptions",
|
||||
// set it using the equivalent form of "item.exactMatch"
|
||||
if ( !this.item.isActiveMatchOptions )
|
||||
{
|
||||
this.item.isActiveMatchOptions = this.item.exactMatch ? this._fuseUtilsService.exactMatchOptions : this._fuseUtilsService.subsetMatchOptions;
|
||||
}
|
||||
// Set the "isActiveMatchOptions" either from item's
|
||||
// "isActiveMatchOptions" or the equivalent form of
|
||||
// item's "exactMatch" option
|
||||
this.isActiveMatchOptions =
|
||||
this.item.isActiveMatchOptions ?? this.item.exactMatch
|
||||
? this._fuseUtilsService.exactMatchOptions
|
||||
: this._fuseUtilsService.subsetMatchOptions;
|
||||
|
||||
// Get the parent navigation component
|
||||
this._fuseHorizontalNavigationComponent = this._fuseNavigationService.getComponent(this.name);
|
||||
|
||||
// Mark for check
|
||||
this._changeDetectorRef.markForCheck();
|
||||
|
||||
// Subscribe to onRefreshed on the navigation component
|
||||
this._fuseHorizontalNavigationComponent.onRefreshed.pipe(
|
||||
takeUntil(this._unsubscribeAll)
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
[ngClass]="{'fuse-vertical-navigation-item-active-forced': item.active}"
|
||||
[routerLink]="[item.link]"
|
||||
[routerLinkActive]="'fuse-vertical-navigation-item-active'"
|
||||
[routerLinkActiveOptions]="item.isActiveMatchOptions">
|
||||
[routerLinkActiveOptions]="isActiveMatchOptions">
|
||||
<ng-container *ngTemplateOutlet="itemTemplate"></ng-container>
|
||||
</a>
|
||||
|
||||
|
@ -39,7 +39,7 @@
|
|||
[ngClass]="{'fuse-vertical-navigation-item-active-forced': item.active}"
|
||||
[routerLink]="[item.link]"
|
||||
[routerLinkActive]="'fuse-vertical-navigation-item-active'"
|
||||
[routerLinkActiveOptions]="item.isActiveMatchOptions"
|
||||
[routerLinkActiveOptions]="isActiveMatchOptions"
|
||||
(click)="item.function(item)">
|
||||
<ng-container *ngTemplateOutlet="itemTemplate"></ng-container>
|
||||
</a>
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnDestroy, OnInit } from '@angular/core';
|
||||
import { IsActiveMatchOptions } from '@angular/router';
|
||||
import { Subject } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { FuseVerticalNavigationComponent } from '@fuse/components/navigation/vertical/vertical.component';
|
||||
|
@ -17,6 +18,7 @@ export class FuseVerticalNavigationBasicItemComponent implements OnInit, OnDestr
|
|||
@Input() item: FuseNavigationItem;
|
||||
@Input() name: string;
|
||||
|
||||
isActiveMatchOptions: IsActiveMatchOptions;
|
||||
private _fuseVerticalNavigationComponent: FuseVerticalNavigationComponent;
|
||||
private _unsubscribeAll: Subject<any> = new Subject<any>();
|
||||
|
||||
|
@ -29,6 +31,11 @@ export class FuseVerticalNavigationBasicItemComponent implements OnInit, OnDestr
|
|||
private _fuseUtilsService: FuseUtilsService
|
||||
)
|
||||
{
|
||||
// Set the equivalent of {exact: false} as default for active match options.
|
||||
// We are not assigning the item.isActiveMatchOptions directly to the
|
||||
// [routerLinkActiveOptions] because if it's "undefined" initially, the router
|
||||
// will throw an error and stop working.
|
||||
this.isActiveMatchOptions = this._fuseUtilsService.subsetMatchOptions;
|
||||
}
|
||||
|
||||
// -----------------------------------------------------------------------------------------------------
|
||||
|
@ -40,16 +47,20 @@ export class FuseVerticalNavigationBasicItemComponent implements OnInit, OnDestr
|
|||
*/
|
||||
ngOnInit(): void
|
||||
{
|
||||
// If the item doesn't have "isActiveMatchOptions",
|
||||
// set it using the equivalent form of "item.exactMatch"
|
||||
if ( !this.item.isActiveMatchOptions )
|
||||
{
|
||||
this.item.isActiveMatchOptions = this.item.exactMatch ? this._fuseUtilsService.exactMatchOptions : this._fuseUtilsService.subsetMatchOptions;
|
||||
}
|
||||
// Set the "isActiveMatchOptions" either from item's
|
||||
// "isActiveMatchOptions" or the equivalent form of
|
||||
// item's "exactMatch" option
|
||||
this.isActiveMatchOptions =
|
||||
this.item.isActiveMatchOptions ?? this.item.exactMatch
|
||||
? this._fuseUtilsService.exactMatchOptions
|
||||
: this._fuseUtilsService.subsetMatchOptions;
|
||||
|
||||
// Get the parent navigation component
|
||||
this._fuseVerticalNavigationComponent = this._fuseNavigationService.getComponent(this.name);
|
||||
|
||||
// Mark for check
|
||||
this._changeDetectorRef.markForCheck();
|
||||
|
||||
// Subscribe to onRefreshed on the navigation component
|
||||
this._fuseVerticalNavigationComponent.onRefreshed.pipe(
|
||||
takeUntil(this._unsubscribeAll)
|
||||
|
|
Loading…
Reference in New Issue
Block a user