Angular2: Going back a couple of steps

Is there a method to go back two steps when clicking on (click) goBack($event) instead of using just this.location.back()? I am looking for a way to access a list of locations in an array and cut out the last element.

Answer №1

In the event that there is absolutely no possible way for the user to directly access this route (such as through linked websites, saving a bookmark, or clicking on an email link), it becomes incredibly vulnerable.

Consider what would happen if a user saved the page as a bookmark, but the "home" link triggered a location.back(): they would be redirected back to the previous website visited.

To avoid these issues, it is advisable to utilize static links to established routes instead.

Answer №2

Explore the features of window.history

window.history.go(-2);  

Answer №3

In the event that you need to go back two levels, a possible solution would be:

this.router.navigate(['../../'], { relativeTo: this.route });

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Utilize SCSS values within TypeScript by applying them on a class level

let changeClassDisplay = document.getElementsByClassName('sidebar'); for (var i = 0; i < changeClassDisplay.length; i += 1) { changeClassDisplay[i].style.display = 'block'; } I encountered an issue with this code whe ...

Issue with launching Angular 6 project

I attempted the solution from this link, but unfortunately, it did not work for me. I have cloned a project from GitLab and am attempting to run it. First, take a look at the output of my ng version command: . The project is based on Angular 6 and is ava ...

Error: Unable to inject UrlHandlingStrategy as no provider was found

I recently upgraded my application to Angular 14 and encountered a challenging error. Despite configuring RouterModule for Root and child with lazy loading, I am now facing a circular dependency issue related to the Router. I'm unsure how to further d ...

Response from Mongoose Populate shows empty results

Within my MongoDB, there exist two collections: Users and Contacts. In my project structure, I have defined two models named User and Contact. Each User references an array of contacts, with each contact containing a property called owner that stores the u ...

Issue occurred while trying to deploy Firebase functions following GTS initialization

Objective: I am aiming to integrate Google's TypeScript style guide, gts, into my Firebase Functions project. Desired Outcome: I expect that executing the command firebase deploy --only functions will successfully deploy my functions even after init ...

What could be causing Next.js to re-render the entire page unnecessarily?

As a newcomer to Next.js, I am trying to develop an app where the header/navbar remains fixed at all times. Essentially, when the user navigates to different pages, only the main content should update without refreshing the navbar. Below is the code I have ...

Failure to invoke Jest Spy

Currently, I am attempting to conduct a test utilizing the logging package called winston. My objective is to monitor the createlogger function and verify that it is being invoked with the correct argument. Logger.test.ts import { describe, expect, it, je ...

"Encountered an error while trying to access the 'get' property of an undefined object in Angular 7 Forms

I encountered an issue while working on Angular 7 forms. The built-in validation for the form functioned flawlessly, but when attempting to implement custom validation by creating a custom function, I faced an error related to the userpass field. My intent ...

There was an unexpected error: Module 'C:Users... ode_modules@angular-devkituild-angularsrcdev-server' could not be located

Struggling to get my Angular project up and running on a different system. I've copied all the necessary files (hopefully) but when I attempt to run the project using ng serve, it throws this error: An unhandled exception occurred: Cannot find module ...

What is the validity of using Promise.reject().catch(() => 5) in Typescript?

Can you explain why the TS compiler is not flagging an error for this specific code snippet? Promise.reject().catch(() => 5) Upon inspecting the definition of the handler function within the catch, we come across the following code: interface Promise&l ...

Functions outside of the render method cannot access the props or state using this.props or this.state

Just starting out with react. I've encountered an issue where a prop used in a function outside the render is coming up as undefined, and trying to use it to set a state value isn't working either. I've researched this problem and found va ...

Why am I encountering numerous errors while attempting to install Juice Shop?

My attempt to install the juice shop app from GitHub resulted in 63 errors showing up after running the command npm install. [riki@anarchy]: ~/juiceShop/juice-shop>$ npm install (Various warnings and engine compatibility issues) Multiple vulnerabilit ...

Ng5 npm is encountering an error stating 'Module './topologicalSort' could not be located.'

I encountered an issue with my Angular 5 app. Whenever I attempt to run it, I receive the following error message after running an npm start. Error: Cannot find module './topologicalSort' I suspect that this issue is related to 'webpac ...

Issue encountered while attempting to start a project using Ionic

After cloning a repository using the git clone command and running npm install, I encountered a message with warnings about vulnerabilities: npm WARN deprecated" and at the end it says "55 vulnerabilities (3 low, 12 moderate, 36 high, 4 critical) To addres ...

What is the best way to execute 2 statements concurrently in Angular 7?

My goal is to add a key rating inside the listing object. However, I am facing an issue where the rating key is not displaying on the console. I suspect that it might be due to the asynchronous nature of the call. Can someone help me identify what mistak ...

Trouble encountered with Angular Google Maps integration when using router-outlet

Currently, I am in the process of developing an application that features a map as its header (providing a global view) and another map positioned in the center of the page to showcase detailed views. To demonstrate this setup, I have shared a working exam ...

ThymeLeaf does not support the parsing of JavaScript code

I'm working on serving an Angular app with spring boot/thymeleaf. This is the structure of my class that sends html/css/javascript: @Controller public class ResourceProvider { @RequestMapping(method = RequestMethod.GET, value = "/") ...

Here is a method to display a specific string in the mat-datepicker input, while only sending the date in the backend

enter image description hereIn this code snippet, there is a date input field along with a Permanent button. The scenario is that when the Permanent button is clicked, it should display "Permanent" in the input UI (nativeElements value), but the value bein ...

How can I transform a Firestore collection into an array?

I'm struggling with converting the data retrieved from Firestore into an array that can be used for a chart.js graph. Retrieving Data from Firestore fetchData(){ //Get data this.updatesCollection = this.afs.collection(pathStats); this. ...

Deduce the Prop Component Type by Examining the Attribute Type

I am facing an issue with a component that requires a `labels` attribute. <Component defaultValue={FURNITURE.BED} labels={[ { value: FURNITURE.BED, text: 'Bed', }, { value: FURNITURE.COUCH, text: 'C ...