The getList() function from Restangular is failing to return the expected JSON data

I'm facing an issue with retrieving data from a Restangular promise. Instead of receiving pure JSON data, I always end up with a promise object.

Here is the response from my API:

localhost:3000/api/meal

{
 "status": "success",
 "data": [
   {
     "meal_id": 4,
     "meal_type_id": 2,
     "description": "blahblah",
     "price": "3.50",
     "info": "120/120/20g",
     "restaurant_id": 2
   },
     ...
     ...
}
 ],
 "message": "Retrieved ALL meals"
}

This is the configuration method I'm using to extract data from the response:

 RestangularProvider.addResponseInterceptor(function(data, operation, what, url, response, deferred) {
  var extractedData;
  
  if (operation === 'getList') {
    return data.data;

  } else {
    extractedData = data.data;
  }
  return extractedData;
});

Here is how I attempt to retrieve data from my API:

  Restangular.all('meal').getList().then(function(meals) {
     $scope.menu = meals; 
     console.log($scope.menu);
 });

Unfortunately, I keep getting unexpected responses like this: https://i.sstatic.net/pvjTJ.png https://i.sstatic.net/xYSUw.png

All I need is the JSON array from the "data" field to use in my application.

Answer №1

Hey everyone, I wanted to update you that I finally resolved a bug in my backend API after conducting thorough research and debugging. It was specifically related to one select statement. Thankfully, Express.js, pg-promise, and the rest of the application are now functioning properly.

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

Exceptionally high memory usage detected in AngularJS

My AngularJS application is running into performance issues due to high memory consumption. There are around 200-250 repeated elements, each containing inner items with nested ng-repeats. The JS Heap memory allocation reaches up to 70MB, causing the webpag ...

getStaticProps function in Next.js fails to execute

My [slug].js file includes two Next.js helper functions, getStaticPaths and getStaticProps. These functions are exported and create the path posts/[slug]. I have also added a post file named hello.json. However, when I try to access localhost:3000/posts/he ...

Error in THREE.js: Unable to access property 'lib' from an undefined source (THREE.ShaderUtils.lib["normal"])

I have been working on the challenges provided in the WebGL introductory book by Oreilly. Encountered a runtime error with the following code snippet. After searching online, it seems like I am the only one facing this issue. Could you please assist me in ...

When receiveMessage is triggered, the FCM push notification fails to refresh the view

After following this helpful tutorial on Push Notifications with Angular 6 + Firebase Cloud Messaging, everything is working perfectly. I am able to receive notifications when using another browser. To ensure that my notification list and the length of no ...

When a user manually updates an input, only then will the jQuery change event be triggered

Is it possible to differentiate between user-initiated changes and manual modifications in JavaScript? $('#item').change(function() { alert('changed!'); }); There are times when I need to trigger the change event artificially wit ...

Sorting functionality in Dyntable is not functioning properly when called from an Ajax request

I can't seem to get DynaTable with Ajax to work properly. Sorting, searching, and pagination are not functioning as expected. When I click on the column header, nothing changes in my table. Could someone please assist me? Below is my code snippet: H ...

Using JQuery, retrieve all field values on click, excluding the value of the closest field in each row

I have a dynamic table where each row consists of an input field and a button. I am searching for a simpler way to select all input fields except the one in the current row when clicking the button in each row. All input fields have the same name and the r ...

Leveraging various routes to access data with a shared VueJS 3 component

Could you please review this code snippet: It displays two routes that utilize the same component to fetch content from an API. Main.js const router = createRouter({ history: createWebHistory(), routes: [ { path: "/route1& ...

Javascript editing enhancement for real-time changes

Are there any tools for in-place editing of Javascript code? I'm looking for something similar to Firebug, which is great for instant CSS editing and previewing but doesn't have the capability to edit JavaScript directly. Is there a tool or addon ...

Using Typescript to set a custom timeout duration based on a dynamic variable within a for loop

My function includes a timeout that changes every 3 seconds: setActiveImage(promotions) { for (let i = 0; i <= promotions.length - 1; i++) { setTimeout(()=> { this.activeImage = 'http://myrul/public/Commercials/' + promo ...

The assignment of type 'string' to type 'UploadFileStatus | undefined' is not permissible

import React, { useState } from 'react'; import { Upload } from 'antd'; import ImgCrop from 'antd-img-crop'; interface uploadProps{ fileList:string; } const ImageUploader:React.FC <uploadProps> ...

Is there a way to allow an HTML page rendered by node.js to communicate back to its corresponding node.js file?

I am currently in the process of developing a registry system using node.js and HTML. However, I have encountered an issue where my HTML page is rendered by node.js, but when trying to call it back to the node.js file, it appears that the JS file cannot be ...

Tips for overlaying text on the background in Next.js:

I'm currently working on creating an image element with overlay text. Check out my jsx code below: <div className={styles.img}> <img src={src} alt="" /> <p>{`(${size})`}</p> </div> And here is t ...

In Rails 3, you can utilize JavaScript to submit a form_tag remotely, however ensure that it submits as

I am trying to implement a form_tag in rails 3 that can be submitted using ajax instead of html through javascript. Despite setting the form to submit as javascript, it still submits as html when clicking the submit button. - form_tag({:controller => " ...

When using JavaScript with React, setting a value after the onBlur event can result in users having to click

In my React form, I have an input button with an onBlur event that sets the value to a useState property. However, after the onBlur event is triggered, the user has to click the button twice to focus on it properly. It seems like the page needs time to pro ...

The Quickest Way to Retrieve Attribute Values in JavaScript

I'm trying to access a specific attribute called "data-price". Any tips on how I can retrieve the value of this attribute using this syntax: Preferred Syntax div[0].id: 48ms // appears to be the quickest method Alternative Syntax - Less Efficient ...

Display a single video on an HTML page in sequential order

My webpage contains a video tag for playing online videos. Instead of just one, I have utilized two video tags. However, when attempting to play both videos simultaneously, they end up playing at the same time. I am seeking a solution where if I start pla ...

Can CSS be used to separate elements within a div from the overall page styles, similar to how an iFrame functions?

Is there a way to isolate elements within a div, similar to how it would behave in an iFrame? I am facing issues with the global SharePoint styles affecting my app inside SharePoint. I want to completely disable these global styles so that my app only use ...

Unable to locate the Chrome binary using the JSON configuration file

Currently, I am running Selenium tests with Java and JUnit. The issue I am encountering is that the system keeps indicating: cannot find Chrome binary The problem arises because the binary location is not standard due to my requirement to test multiple ...

What are the possible arguments for the event type onInput?

While diving into the world of html / javascript / vue, I stumbled upon the following code snippet. <input type="text" onInput="doAction(event);"> <script> var mesdata = { message: 'type your m ...