Dealing with undefined Angular UI Router resolve in controller due to data return from factory

Having trouble with Angular UI router? When returning a factory in resolve, why is the controller receiving undefined? What could be causing this issue?

It works with string: When I return a simple string in the resolve function, I am able to get data in the controller.

Factory call

app.factory('LogHomService', function(Service1, Service2) {
  return {
    MyService: function(data) {
      Service1.log("user", encodeURIComponent("ad"))
        .then(function(response) {
          var FullUrl = response.strURL;
          var objs = response.products;
          Service2.pageLoad(objs)
            .then(function(response) {
              var homeScreen = response;
              data(homeScreen);
            });
        });
    },
  };
});

With UI router:

.state('home.prod', {
  url: '/product',
  views: {
    '@': {
      templateUrl: baseUrl + 'home/product',
      controller: 'productController'
    }
  },
  resolve: {
    param2: function(LogHomService) {
      return LogHomService.MyService();
    }
  }
})

And in the Controller:

var productController = function ($scope, $rootScope, $state, $stateParams,param2)
{
       console.log(param2); // This logs as undefined
}
CashController.$inject = ['$scope', '$rootScope', '$state','$stateParams','param2');

Answer №1

There seems to be an issue within the definition of your MyService() method as it does not return anything. Consequently, the value injected in the controller from the resolve ends up being undefined. To resolve this, consider modifying your code to ensure that the MyService() method returns a promise/value.

MyService: function(data) {
  return Service1.log("user", encodeURIComponent("ad"))
    .then(function(response) {
      var FullUrl = response.strURL;
      var objs = response.products;
      Service2.pageLoad(objs)
        .then(function(response) {
          var homeScreen = response;
          data(homeScreen);
        });
    });
},

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 is the best method to smoothly navigate to a specific id on a webpage after conducting a search using

I want to implement a jQuery function that allows me to scroll down to an id containing search results. The script as a whole, minus the JS, is functioning properly. I just need assistance in creating a method to search for specific id values. Below is my ...

Traverse through the loop with React Material UI in JavaScript

Hi everyone, I'm having trouble with this code. I want to iterate through an object called paleogenome.data and create a CardHeader for each item: { Object.keys(paleogenome.data).forEach(function (key){ console.log(paleogenome.data[key] ...

Is the Javascript framework malfunctioning even though the code is identical to the one on jsfiddle

<html> <head> <meta charset="UTF-8"> <title>Interactive Globe Display using iTowns</title> <style> html { height: 100%; } body { margin: 0; overflow: hidden; ...

Struggling with updating information in AngularJS

Developing a web application using the MVC framework with AngularJS has been an interesting journey for me. Here is a snippet of my application: var app = angular.module("AngularApp", []); One key component of my application is the controller: app.cont ...

Set JSON Value Session

In the table, there is an option to edit certain entries using a button. I have developed a function that retrieves JSON data and populates the table with it. This process happens before any other actions. Once the data is loaded, my goal is to create a c ...

The flow union type operates smoothly without any errors occurring

In the code snippet below, I have defined a type 'Something' which can have three possible values: 'A', 'B', or 'C'. The function 'f' takes an object of type Something as input and returns a string based on ...

JavaScript Functions Not Being Executed by Onclick Event in Internet Explorer 8

When a user clicks, I need two functions to run. This works in Firefox and Chrome, but not in IE8. The first function should display a modal (indicating that the form is being saved, although it's not showing up) while the second function saves the f ...

Khan Academy project "Bookshelf" is experiencing an issue where the For Loop is not

"This new program showcases an array of books with the use of a loop, allowing multiple books to be displayed in a row." I am looking to implement the for loop to showcase each book stored in the array. Currently, the 'i' variable rema ...

Is there a way to delete a table's row using JavaScript?

Hey there, total newbie to coding here. I'm working on a simple to do list project. The adding function is working great, and here's the code for it: let salvar = document.getElementById("salvar") let remove = document.getElementById("remove ...

JS stop the timer from the previous function call before starting a new function call

Within my React app, I have implemented a slider component from Material UI. Each time the slider is moved, its onChange event triggers a function to update the state. However, I have noticed that the component rerenders for every step of the slider moveme ...

Troubleshooting CSS compatibility issues in Firefox browser (or HTML rendering as plain text)

In a unique web page comparing two photos, the clicked one changes, but there's an issue in Firefox where HTML displays as text and links don't work. CODE:- * { box-sizing: border-box; } html { height: 100%; } body { height: 100%; mar ...

The scope value remains unchanged when being utilized in an $http request

I'm facing an issue while attempting to load data from a local JSON file into a $scope variable. myApp.controller('myController', ['$scope', '$http', function ($scope, $http) { $scope.menu = function () { $http ...

What is the process of implementing a service in AngularJS?

For my Angular JS project, I am working on creating a module to include my service (file: utils/productos.js) and then load it as a dependency for my ventas module (ventas/ventas.js). However, I encountered the following error: Error: [$injector:nomod] Mo ...

Steps to open a webpage with a URL that includes #tags=green, pink, and white at the conclusion

Here's the challenge - Open your page with a URL that includes #tags=green,pink,white at the end Create a JavaScript script that extracts the tags from the URL and displays them in a list, with each tag as a separate list item. For instance, if the ...

Effortless 'rotational' script

I am currently developing a HTML5 Canvas game with the help of JavaScript. My aim is to create an object that smoothly transitions to a specific direction. The direction is being stored as a variable and calculated in radians. Here's how the code op ...

Issue encountered with react-toolbox 2.0-beta.6's ThemeProvider not functioning as expected

I have been attempting to modify the color-primary and color-accent variables in react-toolbox using react-toolbox-themr, but without success. I have created a simple git repository to showcase this issue. Below is my react-toolbox-themr.config.json: { ...

Issues with updating the style in Internet Explorer and Firefox using JavaScript are currently unresolved

I am facing an issue with my program where a name from an auto-complete is sent to a JavaScript function that dynamically creates a label with a button inside. Surprisingly, the DOM methods used to set style properties do not work in Firefox and IE 7, but ...

Having issues with Exit Property functionality in Framer Motion when using react js

Help Needed: Framer Motion Exit Property Not Working I've been trying to get the exit motion to work on Framer Motion with React JS for over a week now, but everything else seems to be functioning correctly. I have installed the latest version of Fra ...

JavaScript DateTimePicker onChange event malfunctioning

Issue with JS datetimepicker onChange event not functioning. Attempts have been made using OnSelect, OnClose, OnChange, OnHide, OnChangeMonth to trigger the datetimepicker event, but none of them seem to be effective. <input type="text" class="form-co ...

Reconfigure the Node application using Express to seamlessly access modules through route files

I recently created a basic app using npm express. After generating the app.js file, I attempted to add new modules but encountered an issue where I couldn't access them in the route files. For example, when trying to utilize the 'request' mo ...