I never rely on the browser back button, I prefer to remain on the same page

Being new to Angular, I have come across the following code snippet:

HTML template:

<a href="" ng-click="goToCategories();">See categories</a>


JS File:

$scope.goToCategories= function () {
                CategoriesService.getCategory().then(function () {
                    $state.go('home.cat');
                });
            };

JS File 2:

$stateProvider.state('home.cat', {
        parent: 'logged',
        url: '/cat',
        templateUrl: 'home/home-cat.html',
        ...
    });

One issue I encountered is that when on home-cat.html, the browser back button does not effectively navigate back. It seems to remain stuck on home-cat.html. How can this be resolved?

Appreciate any guidance on this matter!

Answer №1

Is 'logged' considered a route with a URL or an abstract route?

Does the link you are coming from have a unique URL?

Did you realize that you instructed $state.go to navigate to a non-existent route?

$state.go('home.cat');

It should likely be changed to

$state.go('home.funnel');

If you could create a plunkr or jsfiddle that would be helpful :)

Note: You can simplify the usage of

<a href="" ng-click="goToCategories();">See categories</a>

by using

<a ui-sref="home.funnel">See categories</a>

or

<a ui-sref="home.funnel({ param: value})">See categories</a>

Check out the documentation here: https://github.com/angular-ui/ui-router/wiki/Quick-Reference#ui-sref

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

Detecting Changes in Angular2 Component Attributes via Observables

When working with Angular 2 components that have input attributes defined using @Input, how can I create an observable to track changes to those input attributes (not to be confused with user input from a form)? export class ExampleComponent implement OnC ...

`Accessing information within a nested JSON array``

I'm currently parsing through the JSON data below. While I can extract the id and name fields without any issues, I am encountering a problem when trying to access json.templates[i].dailyemails.length, as it always returns 0. Below is the structure o ...

Creating unique ID tags using AngularJS

I am struggling with creating an HTML structure that looks like this: <ul> <li id="r1_1">Root node 1 <ul> <li id="child_node_1">Child node 1</li> <li id="child_node_2">Child node 2</ ...

Conceptualization of a Strategy Game Server

Recently, I've been brainstorming the idea of developing a WebGL-based real-time strategy game that allows multiple players to join and play together. My plan is to utilize Node.js for creating the game server, along with websockets to establish real- ...

Changing URI to File Object using JavaScript

I have successfully retrieved the URI of a selected file in my Ionic app using the cordova-fileChooser plugin. https://i.sstatic.net/NxXti.jpg Next, I used the cordova-plugin-filepath to obtain the absolute path of the file from the nativeURL on the phon ...

Creating a dynamic 2D image using HTML5 animation

As a beginner HTML5 developer, I have been exploring ways to create an animated image using multiple jpg files stored in a specific folder on my website. My goal is to design an animation of a rabbit running across the page when a user clicks on a button. ...

Javascript textfield button function malfunctioning

Here is the code I have created: HTML: <form method="post" id="myemailform" name="myemailform" action="form-to-email.php"> <div id="form_container"> <label class="descriptio ...

Despite element being a grandchild, the function this.wrapperRef.current.contains(element) will return false

The issue arises when using the EditModal component with an onClickOutside event. This component includes a child element, a Material-UI Select, where clicking on a MenuItem triggers the onClickOutside event, causing the modal to close without selecting th ...

Use Javascript to extract an array of strings enclosed in double quotes

Is there a way to extract an array containing ["13139","13141", "13140"] from the following data structure? { "13139": [tx[0]], "13141": [tx[1]], "13140": [tx[2]] } I attempted to use JS ...

What is the best approach for manipulating live data in localStorage using ReactJS?

I am working on creating a page that dynamically renders data from localStorage in real-time. My goal is to have the UI update instantly when I delete data from localStorage. Currently, my code does not reflect changes in real-time; I have to manually rel ...

Displaying a pair of values using a single noUISlider

I'm trying to achieve something unique with a noUIslider range by outputting two values. While I've managed to display the same value twice using examples from the noUIslider documentation, my goal is to have one of the outputs show a value that ...

How to display an element using an if statement in Next.js

I am attempting to incorporate a parameter into a nextJS component that will only display if a certain condition is met. At the moment, my code looks like this: return ( <div role="main" aria-label={this.props.title} classN ...

Hide only the table that is being clicked on, not all tables

Essentially, I am using document.querySelectorAll() to retrieve an array of div elements. In my function, handleClick(), each time the button is clicked, I want to hide the table associated with that specific button. This is the current situation: https:/ ...

Resetting the CSS for an input field: a step-by-step guide

My situation involves having a global CSS style set for text type inputs, such as: input[type=text] { padding:10px; width:100px; //and many more } Now, I am incorporating a plugin called colorpicker into a specific div. This plugin generates some input e ...

Copying the position of one object to another in THREE.js does not function as expected

Recently I started experimenting with Three.js and I’m currently working on a project where I need to position a SpotLight at the same coordinates as the camera. Below is the code snippet I’m using: $(document).ready(function() { init(); }); func ...

Issue with Jquery change event not functioning as expected

My webpage consists of the following HTML code: <form id="fileuploadform"> <input type="file" id="fileupload" name="fileupload" /> </form> Accompanied by this snippet of jQuery code: $(':file').change(function(){ var ...

Transmit messages from server (via Expressjs routing) to the client

I am looking for guidance on how to effectively send messages from the server to the client and incorporate this functionality into routes/index.js within my mean stack project. Can anyone provide insights on using socket.io in this context?: router.post( ...

How to retrieve element from templateUrl in AngularJS controller

I am facing a challenge in populating select(option) element inside a template html file from the controller. Although I have managed to do it successfully, I am unable to set a default value to avoid the initial empty option. Here is a snippet from the t ...

What is the process for modifying the logfile path in phantomjs using selenium?

Is there a way to modify the default --webdriver-logfile parameter that selenium passes to phantomjs when using them together? This is the line in the selenium log: 11:06:06.960 INFO - arguments: [--webdriver=14380, --webdriver-logfile=<ROOT PATH DELE ...

Having trouble with Javascript/ajax/php: data is successfully sent from server to client, but client to server communication is not working as

Apologies for the duplicate post (Admins, kindly remove the other one!). I've been receiving great assistance from you all and was hoping to seek your help once again with the following question: I am currently working on implementing AJAX by allowin ...