NativeScript Angular routing error after changing context of application - nativescript

Question

I apologize at the start for the lengthy explanation that follows. I believe it is necessary to fully explain what is going on.
I setup my NS app to used tabbed navigation with a login screen by following the writeup here.
The overall structure of the app is identical to the structure of the app in the git repo here.
Instead of the players and teams in the git repo I have 3 tabs: Dashboard, Advisor, and Tasks. The tasks component uses a tasks service to get the tasks for the user via an API call and then displays a list of tasks. The user can tap on the task to view the task details. I use a class called Global that is imported by all of the components to store context info such as the username and the API token that was acquired after authenticating.
I replaced the welcome component with a profile component, the idea being that a profile button is displayed in the ActionBar, and from anywhere in the tab view the user can tap the profile button to view the profile page. I achieved this by including the following code in each of the tab components:
toProfile() {
this.re.navigateByUrl("/profile");
}
I am sure that is not the most efficient way to do it but it was what I came up with and it works. The profile page shows a bit of info and allows the user to log out. If the user is designated as an admin it provides a form to allow the admin user to impersonate any other user and see the app exactly as that user would.
The following code displays the impersonate form:
<GridLayout *ngIf="isAdmin" columns="auto, auto" rows="auto, auto">
<TextField hint="username" [(ngModel)]="impersonateUser" row="1" col="0"></TextField>
<button text="Impersonate" (tap)="impersonate()" row="1" col="1"></button>
</GridLayout>
The profile component imports the user service, task service, and the Global class. When an admin user enters a username (for example we will use "user2") and taps "impersonate" the following function in the profile component is called:
impersonate() {
Global.username = this.impersonateUser;
Global.isAdmin = "0";
this.taskService.reset();
this.userService.getUserInfo(Global.username)
.subscribe(
(resp) => {
this.userService.saveSession(Global.username, Global.token, Global.expires);
this.re.navigateByUrl("/tabs/default", {clearHistory: true});
},
(exception) => {
alert("Something went wrong.");
}
);
}
The task service reset function just clears any data the task service had in memory. I am navigating to /tabs/default at the end to trigger the onInit functions of the components so that new tasks will get pulled for the user being impersonated. The tasks page loads and displays the correct tasks that correspond to user2 via the following code:
<ng-template ngFor let-task [ngForOf]="tasks">
<GridLayout class="data-container" columns="*, auto" rows="auto, auto" [nsRouterLink]="['../task', task.ID]">
<Label [text]="task.TITLE" class="task-title" row="0" col="0"></Label>
<FlexboxLayout class="task-date" row="1" col="0">
<Label [text]="task.START_DATE | slice:0:10 | date:'MMM d, yyyy'"></Label>
<Label text=" - "></Label>
<Label [text]="task.END_DATE | slice:0:10 | date:'MMM d, yyyy'"></Label>
</FlexboxLayout>
<Label text="" class="fas task-status" [ngClass]="{'completed' : task.COMPLETED}" rowSpan="2" col="1"></Label>
</GridLayout>
</ng-template>
Everythign works up to this point. When the admin user taps on one of the tasks to view the task details I get the following error:
Error: Uncaught (in promise): TypeError: undefined is not an object (evaluating 'this.currentOutlet.peekState')
When I inspect the elements with Chrome dev tools I can see that the GridLayout element has the proper ID that matches the task it should link to
<GridLayout ng-reflect-params="../task,5e46c219add54" iosOverflowSafeArea="true" classNAme="data-container">
Any help or insight would be greatly appreciated. I am relatively new to both Angular and NativeScript.
EDIT:
Here is a link to a NS playground where you can see the issue in action. I have removed just about everything that is not needed to replicate the issues.
To replicate:
Sign in with the username "u1".
Go to the tasks tab and tap one of the tasks. You will be taken to the task details.
Tap the Profile button on the Activity bar.
On the profile page enter u2 in the username field under Admin and tap the impersonate button. You will be returned to the dashboard as user2.
Go to the tasks tab and tap one of the tasks.
Tapping on the task should take you to the task details but instead, it produces the error described above.
NOTE: Tapping on any of the tasks on the dashboard at any time will not work. That is another issue I am trying to figure out. If you can help me figure out what I am doing wrong there as well it would be much appreciated.