Confusion surrounding parameter handling in Angular's UI-Router

I have a state:

.state({
        name: "some_url",
        url: "/some",
        templateUrl: "views/some.html",
        controller: 'someCtrl',
        params: {
            someData: {
                'mout': null,
            }
        }
    })

Following that, I update it in the controller:

$scope.someData = $stateParams.someData;
$scope.someData['mykey'] = 2;

and navigate to the next URL:

$state.go("next_url");

If later on the next URL I do:

console.log($stateParams.someData)
It returns undefined, which is expected.

However, if I then go back to $state.go("some_url");, and do:

console.log($stateParams.someData)

It displays:

{'mykey': 2}

Is there a way to clear the stateParams?

Answer №1

When working with Angular, it's important to remember that the framework creates a singleton object. This means you need to clear it before executing the state.

One way to achieve this is by using:

// $state.go(state, params, options);

$state.go("some_url", null, {reload:true});

Answer №2

To achieve the desired result, you can use the following code snippet:

$state.go("some_url", null, {reload:true});

If using HTML, consider utilizing the ui-sref-opts parameter like so:

<md-button ui-sref="some_url" ui-sref-opts="{reload: true}" >RETURN</md-button>

For more information and detailed documentation, please refer to this link.

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

Enhancing React URLs

Our company deals with URLs in this format: http://helloworld.com/product?filter[category][0]=persian We aim to transform the URL into a cleaner version: http://helloworld.com/product-persian When additional filters are added to the current UR ...

The onsuccess method is not triggered by gapi.signin2.render in an Angular application

I am currently utilizing gapi.signin2.render to generate a customized Google Sign in button within Angular. Interestingly, this exact code functioned flawlessly in a previous project, but unfortunately, it is not working as expected now and I am struggling ...

Changing the background color using jQuery without any noticeable visual impact

In the process of developing a single-page web application, I am encountering an issue with rendering items on screen based on XML data. I am able to add and manipulate DOM elements effectively for 99% of cases. However, within the 'scriptForm' d ...

Uncovering the hidden treasures: extracting value from data using AngularJS

{ "code": 2001, "message": "todays usage", "results": [ { "date": "2015-03-20", "download": 7.063141, "mac": "18f46ab79f0d", "upload": 16.086909 } ], "status": 200 } Can someone please help me extract the values o ...

Prevent the afterTagAdded event from being triggered when loading pre-added elements through Ajax using the Tag-it plugin

Here's my dilemma - when I click a button, I load <ul id="members"> <li>member1</li> <li>member2</li> </ul> (the ul is placed inside the .modal-body) via ajax, with pre-existing list elements. After th ...

Transferring Information from AJAX to PHP

Every time I try to log in, I keep getting a "failed" status even though I am entering the correct values. However, if I change the $sql in the login.php code to match the database values, I get a "success" status. I suspect there may be an issue with send ...

HttpRequestInterceptor is repeatedly showing the same error multiple times

Within my AngularJS app, I implemented an HttpRequestInterceptor to show a notification using toastr whenever a request fails. angular.module('spwApp.factories') .factory('httpRequestInterceptor', ['$q', '$injector&a ...

What is the most effective way to filter individuals based on their place of residence in MongoDB?

I am managing a database containing over 800 documents, each with detailed information about individuals such as: "_id" : ObjectId("5adf3c1544abaca147cdd399"), "index" : 80, "guid" : "ff1c8885-80fc-41de-a6e2-5a59ccd206e9", "isActive" : true, "balance" ...

Is it possible to retrieve only the attributes in an array?

https://i.sstatic.net/E1DMb.png I am working with an array that has properties embedded within it. I am wondering if there is a method to separate out these properties from the array data and transform them into a distinct object containing only the prope ...

Issue with the useState hook not correctly updating a value

I'm a beginner in the world of react and I'm puzzled by why the title inside the h1 tag updates, but the url within the Image Component remains unchanged? Component Overview import React, { useState, useEffect, useContext } from 'react' ...

Using (javascript:) within Href attributes

Recently, I've noticed some people including "javascript:" in the href attribute of an a tag. My question is: what is the purpose of this? Does it guarantee that clicking on the a tag directs the function of the click to JavaScript for handling, rathe ...

Toggling the JQuery toggleClass() function to switch a class on and off (or delete it afterwards

Utilizing an angular directive to display a page with left and right columns using <left-column></left-column> and <right-column></right-column>. Whenever a user clicks on an anchor tag <a href="#target1">Target 1</a>, i ...

Interactive sub-menu that only appears when hovered over

One of the issues I am facing is with a "sub-menu" that only appears on :hover. Check out the JSFiddle here for reference. $('.prices').hover(function () { $('.sub-menu').fadeIn(150); }, function () { $('.sub-menu').f ...

Encountering a problem with data types in React TypeScript Context

Currently delving into TypeScript with React and facing some challenges. I've set up cart.context.tsx but encountering this error: (property) React.ProviderProps<AppContextInterface>.value: AppContextInterface Type '{ isCartOpen: boolean; s ...

Adjust a Javascript script to choose the best font color for use in R Shiny applications

I am currently seeking to determine the font color of hover messages based on the background color. This means white if the background is dark, and black if it is light. However, I stumbled upon a Stack Overflow question with a Javascript solution that see ...

Enhance the efficiency of the replace function in JavaScript

Seeking a more efficient approach to perform this function, could you provide some assistance? function removeAccents(text) { var text = text.replace(/á/g, "a").replace(/é/g, "e").replace(/í/g, "i").replace(/ó ...

A step-by-step guide to incorporating VeeValidate with vue-i18n

When a click event is triggered, I am able to change the language in vue-i18n. However, I am facing an issue with changing the vee-validate dictionary to match the same language. Main.js import VeeValidate from 'vee-validate' import validations ...

Having trouble with GSAP CDN not functioning properly in your JavaScript or HTML document?

After watching a tutorial on YouTube by Gary Simon, I attempted to animate text using GSAP. Despite following the instructions meticulously and copying the CDN for GSAP and CSSRulePlugin just like him, nothing seems to be happening. Even setting my border ...

Error on AngularJS: [$injector:unpr] Provider unknown: $timeOutProvider <- $timeOut <- notification

I am encountering the following error and I am unsure of the reason: Error: [$injector:unpr] Unknown provider: $timeOutProvider <- $timeOut <- alert controllers\register.js angular.module('testApp') .controller('RegisterC ...

Angular: Finding the total number of Objects containing a particular value

In my JSON database, I have a collection of objects where each one is assigned a specific value: either a, b, or c. [ { "id": 1, "category": "a" }, { "id": 2, "category": "b" }, { "id": 3, "category": "c" }, { "id ...