What causes the AngularJS $rootScope.authenticated to reset?

After logging in and redirecting from one page to the mainpage, it appears that my rootscope is being reset. Below is the code for the redirect after successful login:

self.authUser = function() {
                LoginService.authUser($scope.inputEmail, $scope.inputPassword, 'inf')
                        .then(function(d) {
                            $rootScope.authenticated = true;
                            $window.location.href = '/job';
                        }, function(errResponse) {
                            $scope.errorLogin = true;
                            $rootScope.authenticated = false;
                        });
            };

Here is the code for the mainpage:

<script src="<c:url value="/resources/js/application.js"/>"></script>
    <script src="<c:url value="/resources/js/service/main_service.js"/>"></script>
    <script
        src="<c:url value="/resources/js/controller/main_controller.js"/>"></script>
<title>Insert title here</title>
</head>
<body ng-app='application'>
<div class='container' ng-controller='MainController as ctrl'>
    <span ng-show='authenticated'>lllllllllllllllloloooooo</span>
    <button class="btn btn-lg btn-primary btn-block" ng-click='ctrl.authorize()'>Sign
            in</button>
            </div>
</body>

Upon successful login, the rootScope is set to true but resets when using $window.location.href. Is there a need to reauthenticate on every page load via a post response?

Edit: ngRoute

application.js

'use strict';

var App = angular.module('application', [ 'ngRoute', 'ngCookies' ]).config(
        [ '$routeProvider', function($routeProvider) {
            $routeProvider.when('/', {
                templateUrl : '/job/',
                controller : 'main_controller'
            }).when('/login', {
                templateUrl : '/job/login',
                controller : 'login_controller'
            }).otherwise({
                redirectTo : '/'
            });
        } ]);

Tried $location.path("/"); $scope.$apply();

and $window.location.assign('/job');

also

$timeout(function () {
                            $location.path("/");
                        });

$location doesn't change page & $window refreshes my rootscope

Answer №1

I realized I hadn't been utilizing rootscope effectively and discovered that nGroute wasn't being implemented correctly.

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

What techniques can I employ to ensure that withLatestFrom() effectively interacts with itself?

In my program, I have an intermediate stream that is connected to a source, but it can also trigger events from other sources (such as user input). In another part of my code, there is a derived stream that needs to compare new data from the intermediate w ...

Error: Unable to execute 'surroundContents' on 'Range': The selection within the Range is only partially on a non-Text node

Hello, I’m working on creating a text reader that allows users to highlight text in multiple colors. I’ve already written the code and you can check it out in the sandbox at the link below: https://codesandbox.io/s/gallant-snowflake-oxko7?file=/src/Ap ...

Vibrant progress bar design with CSS

Could someone assist me in coding a multicolor progress bar? I would like it to display red when the progress is less than 50, green when the progress is between 50 and 90, and blue when the progress is between 90 and 100. How can I achieve this? ...

Tips for replacing the text of an li element while preserving its child elements

I attempted to implement functionality similar to a Trello Card when editing a card, where users are prompted with options to edit, move, or copy the card. Here is an example of my code: $(document).ready(function() { $('i').click(function( ...

Having difficulties with the edit function in JavaScript To Do Application

After creating an edit button to modify a task, it functions properly for the initial task I create. However, when attempting to edit subsequent tasks, the edit function defaults back to modifying the input of the first task instead. With each new ta ...

v-if not being updated in real-time within a v-for iteration

Issue Resolved -- Solution Provided Below I encountered an issue in Vue2 where I was attempting to manage a v-if and v-else based on an @click event within a v-for loop. However, the v-if did not dynamically change with each click as expected. Below is t ...

Conceal the dormant brothers and sisters within the nested list

My tool relies solely on JavaScript for functionality. I have created a nested list structure using JSON data: function buildList(data, isSub){ var html = (isSub)?'<div class="nested">':''; // Wrap with div if true ht ...

Challenges with list dropping

My drop down list has 2 sub-categories, but I'm encountering an issue where the second category does not fully expand when opened. I have shared my code on JsFiddle, and I would appreciate it if someone could take a look. It seems like there might be ...

Hydration has finished, but there are some discrepancies - Utilizing Ascii art within a vue component

I encountered an issue with displaying ascii art in the {{ name }} section of my component. While developing, a Vue warning popped up: Hydration text content mismatch in <pre> Followed by an error message: Hydration completed but contains mismatch ...

Javascript code requires server to have default text field values

Based on the choice made by a user, a text field box will either remain concealed or revealed: $("#aForm").on("change", function() { if ($(this).val() == "a") $("#textField").hide(); else $("#textField").show(); }); The issue arises when the ...

Creating methods in Vue that can alter elements created during the mounted lifecycle hook can be achieved by defining functions

I am trying to implement a button that can recenter the canvas. The idea is that when the button is clicked, it will trigger the rec() method which should reposition the canvas that was created in the mounted() function. However, this setup is not working ...

What is preventing Facebook from merging its CSS/JS files together?

I wonder about the reasoning behind Facebook developers' decision not to consolidate their scripts and stylesheets into single files, opting instead to load them on demand through their CDN. Considering the complexity of Facebook as an application, I ...

Resolving the issue in handling the JS challenge called Powers - a combination of functions and arrays

Struggling with a simple task called Powers? Here's the challenge at hand: Numbers have Powers! They can transform themselves in various ways. One such transformation involves: replacing each 0 - with the absolute difference of its neighboring numbe ...

Tips for updating and triggering useEffect when the router changes in React JS

I have a ChartPage function that is being called three times within three different routers. Inside the ChartPage function, I am using "useEffect" to update some variables based on the selected route. However, for some reason, it only triggers once, and wh ...

Showcasing special characters in JavaScript

I am encountering an issue with displaying accented characters in my application; instead of showing ó, it is displaying ⛽. The string originates from a JSON file fetched from a server. Below are the technical specifics: JSON: (This is the data retriev ...

Stop the closure of confirmation box by disabling the space key

I've been working on a website that features a table for users to interact with. Within one column of the table, there are input boxes where users can write notes. Below each input box, there is a save button to store the entered notes in a database. ...

Monitoring individual elements of an array within an Angular service

Is there a way to monitor changes in an array element within a service? Let's consider the following scenario with CartController and ProductListService. Within the ProductListService, data is fetched as follows: /** * Fetch all the products in us ...

Explore and Conceal Images with Jquery

Currently, I am utilizing jQuery to showcase images prior to uploading. However, when newer files are uploaded, I wish to either remove or conceal the previous upload files. Here is my jQuery script: $(function() { // Allowing multiple image ...

Maintain the values of radio buttons, dropdowns, and checkboxes using Javascript

When I click on a radio button, it activates a drop down menu. Upon selecting different values from the drop down, various checkboxes become visible. Now, I want to preserve the selection of the radio button along with the selected drop down values and ch ...

Having trouble with $location.path() not working when trying to redirect from a .then in a factory method

I've been struggling to make my redirect work from my factory no matter what I do. I even tried moving it to the controller but it keeps throwing an error: TypeError: Cannot read property 'model.Email' of undefined The post request seems su ...