Unable to retrieve array using $resource functionality

Having trouble retrieving an array using $resource. Can anyone assist me with this? It works fine when I use $http

Encountering an error in the console:

TypeError: undefined is not a function
at http://127.0.0.1:9000/bower_components/angular-resource/angular-resource.js:597:29
at forEach (http://127.0.0.1:9000/bower_components/angular/angular.js:327:18)
at angular.module.provider.$get.Resource.(anonymous function).$http.then.value.$resolved (http://127.0.0.1:9000/bower_components/angular-resource/angular-resource.js:595:19)
at deferred.promise.then.wrappedCallback (http://127.0.0.1:9000/bower_components/angular/angular.js:11616:81)
at http://127.0.0.1:9000/bower_components/angular/angular.js:11702:26
at Scope.$get.Scope.$eval (http://127.0.0.1:9000/bower_components/angular/angular.js:12797:28)
at Scope.$get.Scope.$digest (http://127.0.0.1:9000/bower_components/angular/angular.js:12609:31)
at Scope.$get.Scope.$apply (http://127.0.0.1:9000/bower_components/angular/angular.js:12901:24)
at done (http://127.0.0.1:9000/bower_components/angular/angular.js:8487:45)
at completeRequest (http://127.0.0.1:9000/bower_components/angular/angular.js:8703:7)

A factory was created with the following method

coeffsResource.factory("CoeffsResources",['$resource', 

function($resource) {
  return $resource('/api/:action',{}, {
    get_all_coeffs: { method:'GET', isArray:false, params: {action: 'getAllRegionCoefficients'} },
    save_all_coeffs: { method:'POST', params: {action: 'storeAllRegionCoefficients'} },
    get_manufacturer: { method: 'GET', isArray:true, params: {action: 'getAllManufacturers'} },
    get_models: { method: 'GET', params: {action: 'getModels'} },
    get_classes: {method: 'GET', params: {action: 'getClassesConfig'} },
    get_regions: {method: 'GET', params: {action: 'getAllRegions'} },
    get_ages_config: {method: 'GET', params: {action: 'getAgesConfig'} },
    get_odometer: {method: 'GET', params: {action: 'getOdometersConfig'} },
    get_tax_config: {method: 'GET', params: {action: 'getTaxConfig'} }
  }, {stripTrailingSlashes: false})
}]);

Integrating the factory into the controller

angular.module('etachkaEvaluatorFrontendApp')
  .controller('CoeffCtrl', function($scope,  $http, $resource, $q, CoeffsResources) {

      var coeffsResourcesObject =  new CoeffsResources();
      coeffsResourcesObject.$get_manufacturer().then(function() {

      }, function() {

      })
})
javascriptangularjsangularjs-serviceangular-resource

Answer №1

It appears that in order to resolve this issue, you may want to include the ngResource dependency.

angular.module('etachkaEvaluatorFrontendApp', ['ngResource'])

Answer №2

Why are you instantiating a singleton in this way? AngularJS Factories are designed differently. Refer to the AngularJS service documentation for more details.

Key points about Angular services:

  1. Lazily initialized – Angular only initializes a service when it is required by a component of the application.

  2. Singletons – Each component that relies on a service receives a reference to the one instance created by the service factory.

Revise your implementation in CoeffCtrl as shown below... (assuming that you have correctly loaded the ngResource module earlier in your code)

.controller('CoeffCtrl', function($scope,  $http, $resource, $q, CoeffsResources) {
  CoeffsResources.$get_manufacturer().then(function() {

  }, function() {

  })

To better understand how factories work, I have created two simple demonstrations. These are not meant for direct use to resolve specific issues, but rather to illustrate the effects of using new with an AngularJS factory.

JSFiddle Link - demo - correct

JSFiddle Link - demo - incorrect - 

TypeError: undefined is not a function

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 sets apart route.use(), route.all(), and route.route() in Express?

Is it possible to replace router.all() with router.use() if the former just matches all methods? Also, what are the differences between using router.use() and router.route()? ...

javascriptnode.jsexpress

DOMException: Access to property "apply" on a cross-origin object has been denied

Over the last day, I've been tackling the FreeCodeCamp assignment "quote machine". Everything is working fine except for the tweet button. You can tweet as many times as you like for one single quote, but not for multiple quotes (once you tweet one, y ...

javascriptvue.js

Confusion arises when applying Angular filter to the numbers 1000, 100, and

I'm currently managing a database where a particular field can have values of 10, 100, or 1000. When filtering to display only the records with a value of "10," it also displays records with values of "100" and "1000." Is there an easy solution for th ...

angularjs

Issue with the reload animation jumping too quickly in Framer Motion on NextJS

While creating an animation for my landing page using NextJS with framer motion, I encountered a strange behavior after deploying the site. The animations started to happen too quickly and it felt a bit off. During development on localhost using Chrome, ev ...

javascriptreactjsanimationnext.jsframer-motion

What is the process for creating a custom Javascript function that can seamlessly integrate with other Javascript libraries?

Is there a way to create a method that can be linked or chained to jQuery methods and other library methods? For example, consider the following code snippet: var Calculator = function(start) { var that = this; this.add = function(x) { start = start ...

javascriptjquery

Sending information from a controller to the $uibModal controller in AngularJS

I have a situation where I have an HTML page with a button called "alta". When this button is clicked, it opens another template as a popup. In this popup, I need to access the values of the fields on the original page. Here is the function for the "alta" ...

angularjsjakarta-ee

Receiving a NULL value instead of the expected string in the soap request

My mobile application interacts with a SOAP web service using AJAX. The user is required to input their username and password in order to log in. When the login button is clicked, a JavaScript function is triggered to send the data to the web service via ...

javascriptjqueryajaxweb-servicessoap

Having trouble getting the .each() method to function properly in jQuery

Looking for a solution to a similar issue here. Currently, I am attempting to iterate through multiple forms on a webpage and perform various actions with those forms. However, I am facing some challenges in making it work. Below is the code I am using: ...

javascriptjqueryhtmldom

Removing Redux State in ReactDeleting data from Redux in a

After displaying a list of data on a table, I have implemented a View component where specific data from the list is passed. However, I am facing an issue when attempting to delete something in the View modal dialog as the redux data delete reducer does no ...

javascriptreactjsreduxreact-hooksmaterial-ui

Update the information for every ride to include an appropriate park_id instead of the `park_name` property

I created a function that takes an array of objects and modifies one of the object's names to its corresponding property id. Here is the function implementation: function prepareRidesData(rides, parks) { if (!rides.length) return []; const parksL ...

javascriptarraysobject

Exploring the transformation of asynchronous callbacks to promises in Node.js

As a novice, I am currently in the process of developing a User Management system using NodeJS. Previously, I had implemented it with MongoDB and Express, but now I am rebuilding it with Express, Sequelize, and Postgresql to enhance my understanding of cer ...

javascriptnode.jspostgresql

Beware of potential infinite update loops when using a basic toggle function in Vue.js

I have been researching the issue of infinite update loops, but I am still struggling to grasp the concept. Despite my efforts, I keep encountering the following error message: [Vue warn]: You may have an infinite update loop in a component render functi ...

javascriptvue.js

What occurs when Render() is called during animation in React?

Curious about how React handles rendering during a component's animation? Let's explore an example where a component is re-rendered due to a state change triggered during its animation. Imagine a scenario where a component's animation lasts ...

javascripthtmlcssreactjsreact-transition-group

javascript / php - modify input fields according to selection change

Can anyone help me with an issue I'm facing? I want to update multiple textfields whenever a new option is selected from my dropdown menu. I've written the following code, but it's not working as expected. Can someone figure out what's ...

phpjavascriptajaxjquery

Removing other objects with Mongoose after an update

I'm facing an issue with my update query in mongoose. I can't figure out why other objects are getting deleted when I only intend to update one specific object. The code is functioning correctly in terms of updating, but it's causing all the ...

javascriptnode.jsmongodbmongoose

I need to know the right way to send a file encoded in Windows-1255 using Express

I'm currently developing an API that is responsible for generating text files. The purpose of this API is to support legacy software that specifically requires the use of Windows 1255 encoding for these files. To create the content of the file, I am r ...

javascriptnode.jsexpresscharacter-encodingiconv

Disappear the form after the user clicks submit

I'm developing a PHP application and I need a way for the form to disappear or hide once the user clicks submit. The form should not reappear for the same user. form.php <?php session_start(); include('config.php'); if( ...

javascriptphpajax

Leverage identical functions across various arrays within an Angular directive

Seeking help with AngularJS as a beginner, I'm struggling to reuse functions across different arrays. There is just one array with 2 more arrays within it. Can someone point out my mistake, please? Thank you. <body ng-controller="MainCtrl as main ...

angularjs

What is the best way to establish a connection between the same port on Expressjs and Socket.io

I am currently using Express.js and Socket.io to develop a chat application. Initially, I created my project with Express-Generator and began by running the node ./bin/www script. However, I decided to remove the ./bin/www file and instead combined it wit ...

javascriptnode.jsexpresssocket.io

Retrieve the property by mapping the click event

I am looking for a way to retrieve the ID of a specific item when a link button inside a mapped list is clicked. How can I achieve this functionality? idFinder(){ console.log('ID:', item.id); } this.sampleData = this.state.data.map((item, ...

javascriptreactjsreact-router-dom