The functionality of $state.go within $stateChangeStart in the app.run is not functioning properly in AngularJS

Having some trouble getting $state.go() function to work. The $on('$stateChangeStart'...); is functioning properly, and I can see the console message when trying to access a protected state without permission. However, the $state.go('toState.name,toParams'); does not seem to be working correctly. Does anyone have any suggestions on how to resolve this issue?

Any assistance would be greatly appreciated, thank you.

app.run(function ($rootScope,$state) {

  $rootScope.$on('$stateChangeStart', function (event, toState, toParams) {
    var requireLogin = toState.data.requireLogin;

    $rootScope.currentUser = true;

    if ($rootScope.currentUser === true && requireLogin === true) {

      console.log(requireLogin);
      console.log($rootScope.currentUser);
      event.preventDefault();
      $state.go(toState.name, toParams);

    } 
    else {

      console.log(requireLogin);
      console.log($rootScope.currentUser);
      $state.go('login.signin');

    }


  });

});

Answer №1

It is important to prevent default event handling when redirecting and consider that transitioning to the login state will involve another state change. Failure to filter it out may result in an endless loop.

{
  if(!toState.name != 'login.signin'){
    console.log(requireLogin);
    console.log($rootScope.currentUser);
    event.preventDefault();
    $state.go('login.signin');
  }
}

$state.go(toState.name, toParams);
does not make sense because this action is already the default behavior.

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

Using axios to pass parameters in a post request

In my webpack project, I am currently using vue-resource for ajax calls. Everything works perfectly with "get" calls, but when I try a post request, my PHP file does not receive any parameters. Even when I use var_dump($_POST), it just gives me an empty ar ...

Updating form values with the use of AngularJS, Node.js, Express.js, and MongoDB

As a newcomer to MEAN technology, I am currently working on a demo project that involves basic CRUD operations using Node.js, Express, Angular JS, and MongoDB. However, I am encountering some challenges specifically with the update functionality. I am str ...

Eliminate any undefined data in the popup map of Javascript

I am working with JSON data that is being displayed in a pop-up on a map. In cases where there is missing data (Visibility), the word undefined appears in the pop-up. Is there a way to remove the undefined text so that it does not show up in the pop-up? ...

Implementing the onClick function for the correct functionality in a ReactJS map component

I have designed a mockup and now I am trying to bring it to life by creating a real component. View my component mockup here Starting with something simple, I created 3 buttons and an array. However, when I click on any button, all features are displayed ...

Issue with dynamic imports in express routes

I am currently attempting to incorporate a dynamic import within an express.js router Here is the code snippet I have: HelloWorldController.js export const helloWorld = function (req, res) { res.send('hello world') } router.js export defa ...

Error: Failed to find the location because geolocate has not been defined

I searched extensively online for a solution to my problem without success, so I am reaching out to seek your assistance. I am attempting to utilize the Google Address auto-complete API within an asp.net core framework. In my razor file, I have included: ...

Creating a slider with a large central image and just three slides that automatically transition

I am trying to create a slider that includes: 3 different images 3 different text captions A button that opens a modal dialog similar to Bootstrap, with each slide's button displaying unique text in the modal The slider should automatically slide Fo ...

How do I show a personalized cookie banner based on the user's location in a NextJs application?

I have a NextJs 12 application with URLs domain.com and domain.com/es. We implemented the OneTrust cookie banner in _document.ts as shown below: <Head> <Script id="one-trust" strategy="befor ...

Tips for positioning input fields and labels in both horizontal and vertical alignment

Below is the HTML code, and I want the tags to look like this: label1: input1 label2: input2 label3: input3 Instead, it currently looks like this: label1: input1 How can I modify the HTML to achieve the desired format? HTML: <div class=" ...

Trouble with Callback firing in Select2's 'Infinite Scroll with Remote Data' feature

After reviewing the tutorial on the Select2 project page, I am implementing a feature to load additional records as the user scrolls to the end of the results. <script> $(document).ready(function() { $('#style_full_name').select2({ ...

ES6 Multiton design pattern: a powerful way to manage multiple instances

I am currently working on implementing the Multiton Design Pattern within my user module in a node.js application. I am seeking out some solid examples to guide me in this process. ...

Tips for organizing wells within bootstrap into separate columns

Looking for a way to organize my well list into two separate columns. I've included a link to my Plunker project here: https://plnkr.co/edit/35oC9Eochk6EPgKeI9he?p=preview. Below is the view section: <div class="well well-lg" ng-repeat="(key, d ...

Navigating a loop in javascript: tips and techniques

I have a challenge with three boxes that are supposed to fade in, shake, and then fade out. The IDs of each box are stored in an array and a loop is used to traverse them. However, the loop only displays the first item. I have tried various methods in Jav ...

Instructions for launching an Android app from a website

Is it possible to invoke my app from HTML? For instance, I am able to successfully call a webpage from my app using this code. android code: startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse( "myDomain.com"))); ...

There was an error parsing the data from the specified URL (http://localhost:8000/src/client/assets/data.json

Hey there, I'm a newcomer to Angular and I'm having trouble reading a JSON array from a file. Every time I try, it gives me a "failed to parse" error. Can someone please provide some guidance? Here is my folder structure: src --assets ---a ...

Error encountered when attempting to insert data into database due to incompatible data types

I am experiencing an issue with Vue multiselect. I am trying to save the id of selected options in a database, but it seems that I am encountering an error related to Array to string conversion. I have declared both site_id and administrator in fillables. ...

Endless loop in RxJS when updating the Ngrx store

// Custom Component HTML <button (click)="reRoute(1)">Select</button> // Custom Component TypeScript reRoute(id: any) { this.store.select(fromStore.getBasketEntities).subscribe(data => { const dynamicUrl = id + '_' + Object ...

Obtaining the date without the time in TypeScript and MongoDB

I'm working with TypeScript and have the following code snippet: const EmployeeDetailsSchema: mongoose.Schema = new mongoose.Schema({ employeeId: { type: String }, advance: { lastAdvanceClosedOn: { type: String }, pending: { type: String ...

Converting UTF-16 to UTF-8 in JavaScript: A step-by-step guide

I'm facing a challenge with Base64 encoded data in UTF-16 format. While most libraries only support UTF-8, I need to find a way to decode the data by dropping the null bytes, although I'm not sure how to go about it. Currently, I'm utilizin ...

Upgrading Table Models with ASP.NET MVC 3 and Ajax

Trying to update a record list using ajax, displayed in a table where each record has a JavaScript delete link. When I load the table initially, the RemoveLink functions correctly. However, once the div "RecordListPartialView" is updated via ajax, it stops ...