Create a duplicate of the $rootScope object

Within my application, I have a $rootScope variable in the .run() function that is used for basic HTTP requests. However, I run into an issue when I try to modify this variable within different controllers by changing the URL suffix and adding different headers.

The problem arises when any controller modifies the $rootScope variable, as it affects the variable's value globally. Despite attempting to create copies of the $rootScope variable in various services and controllers, the original variable still gets altered.

For instance:

Let's assume the initial URL stored in the $rootScope variable is:

When I navigate to the login page, I update the URL to:

by simply appending 'login' at the end. But, when I attempt to logout and change the URL to:

I unexpectedly end up with:

Answer №1

There are a couple of ways to tackle this issue.

1) Instead of modifying the URL directly, consider appending to it as shown below:

$rootScope.URL+"login" //OR logout

2) Another approach is to use angular.copy to duplicate your URL. This will prevent any changes to the $rootScope variable due to references.

$scope.newURL = angular.copy($rootScope.URL);

You can now freely modify $scope.newURL.

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

Troubleshooting Issue with JQuery Date Picker: Date Not Valid

Encountering an issue when using the date from JQuery DatePicker in an SQL Statement variable, resulting in an error of invalid datetime string. Even after attempting to format it with DateTime.Parse or Convert.DateTime. JQuery DatePicker <script> ...

Dynamic calendar with flexible pricing options displayed within each cell

I've been wracking my brain over this issue for quite some time now, but still can't seem to find a solution! Is there a React Calendar out there that allows for adding prices within the cells? I simply want to show a basic calendar where each c ...

Customize attributes for dynamic elements

Is there a way to assign attributes to dynamically added buttons independently? I've encountered an issue where changing one attribute binds all button types together. My goal is to assign {type:Submit} to the first button, {type:Reset} to the second ...

Javascript code experiences a shift in two different styles within a single conditional statement

I'm new to web design and I'm having trouble getting this code to work properly. Can anyone help me fix it so that both styles are applied correctly? // Access the sign_up modal window var modal = document.getElementById('id01'); // A ...

Traverse through the keys and values of a JSON object using JavaScript

I have a json string that needs to be parsed in a specific way. The structure of the json is as follows: { "a": [{ "b": [ ["c"], [] ], "d": [ [], [] ], "e": [ [], ["f"] ], "g": [ [], ...

Guide to forming a JavaScript array from nested JSON data

Looking to parse through an array of objects related to London weather data from the OpenWeatherMap API. How can I create three distinct arrays in JavaScript, each with variable names "dtArray", "tempMinArray", and "tempMaxArray", containing only values f ...

Automatically populate select2 dropdown in ASP.NET MVC Core using AJAX

Currently, I am working on a feature to automatically populate text boxes and drop-down fields in my view. To achieve this, I am using a list that I query again. I came across an example that I am referencing here. However, when trying to debug, the break ...

Angular2: Leveraging click events to manage CSS classes on elements

I am currently developing a web app using Angular 2. I'm facing an issue where the active element should receive an extra CSS class when clicked, but adding the ":active" CSS attribute with a custom class doesn't work as expected. The ":focus" pr ...

Learn the process of transmitting information to Thingsboard using HTTP protocol

Currently, I have thingsboard installed on my Windows local machine, and I am looking to send data from a CSV file using an HTTP POST request. In order to achieve this, I am required to develop a JAVA program that can facilitate the sending of data from ...

Exploring the world of Bootstrap modals through the lens of

I have integrated AngularStrap into my application in order to utilize the modal feature of Bootstrap. However, I am facing an issue with displaying my template modal. I have followed the documentation and referenced my template with template='#test&a ...

``How can I effectively handle and display Angular JSON text in an alert message?

Is there a way to pass a JSON entry into the onClick event for triggering an alert box in AngularJS? I'm attempting to display a message box with the content of a specific JSON entry when clicking on a row within a table. The issue seems to be isolat ...

Is invoking a function from a view in AngularJS detrimental to performance?

I've observed that whenever I invoke functions from my Angular view, the functions are executed multiple times, even when the data remains unchanged. For instance: <div ng-repeat="day in days_array"> {{getWeek(day)}} </div> As a res ...

Is there a way to sequentially load two iframes, with the second one loading only after the first one is fully loaded

Having two different links that trigger ajax calls can be tricky if only one request is allowed per load. This may result in both iframes displaying the same data. Is there a way to work around this issue? Perhaps loading one iframe first and then triggeri ...

Testing a component in Angular 2 that utilizes the router-outlet functionality

I recently set up an angular 2 project using angular-cli. As part of the setup, I created a separate AppRoutingModule that exports RouterModule and added it to the imports array in AppModule. Additionally, I have the appComponent which was generated by an ...

Selection highlighting in a drop-down menu

My dropdown list includes the following items: <asp:DropDownList ID="ddlsendmail" runat="server" Width="250px" AutoPostBack="true" OnSelectedIndexChanged="ddlsendmail_SelectedIndexChanged" onchange="test();"> <asp:ListItem>--select--&l ...

What is the proper way to declare a JavaScript variable using a hyphen symbol?

When it comes to evaluating a string like employee-count = 3, my main issue arises when dealing with variables that may not have a standard naming convention. While valid variable names pose no challenge, identifiers such as employee-count leave me slightl ...

Using backslashes to escape a JavaScript array elements

How can I modify the code below to properly escape HTML and strings in JavaScript arrays? I've been attempting to use a function called escapeHtml to add the necessary slashes, but it's not functioning as expected. Any help would be appreciated. ...

When it comes to entering text in a text input or textarea within a large module in Vue.js, taking

While filling out my large form, I noticed a delay in rendering whenever I typed quickly into the input boxes. <b-form-input v-model="paymentItems.tierStepUPYear" type="text"></b-form-input> ...

What causes Post back to be triggered upon closing the page but not when the user navigates away from it?

My code is set up to detect user navigation or closing of the page. It triggers a post back on close, but not when the user navigates away. Strangely, if I include an alert message, it is triggered at all times. Also, there is a timer on the page that is ...

PHP contact form not being delivered to inbox after email is sent

Here is the HTML code snippet: <form class="contact_form contact_form_h" id="form" method="POST" name="contactform" action="contact-form-handler.php" style="margin-bottom: 10px;"> <div> &l ...