Utilizing AngularJS with Restheart API to streamline MongoDB integration and efficiently parse JSON data outputs

Utilizing RestHeart to expose CRUD functionality from MongoBD. Attempting to call the Rest API from AngularJS and retrieve the JSON output like the one displayed below. My focus is specifically on extracting the name, age, & city fields that are stored in MongoDB.

However, I am uncertain about how to fetch these values.

Javascript code:-

crudApp.controller('listController', function($scope, $http, $location,
    crudService) {

$http.get('http://localhost:8081/jaydb/employees').success(
        function(response) {
            console.log('response : ' +JSON.stringify(response));
            $scope.employees = response;
        });

})

JSON Result from REST API

{
_embedded: {
rh: doc: [
  {
    _embedded: {

    },
    _links: {
      self: {
        href: "/jaydb/employees/55c1e7c41c49a8cd78818bc7"
      },
      rh: coll: {
        href: "/jaydb"
      },
      curies: [
        {
          href: "http://www.restheart.org/docs/v0.10/#api-doc-{rel}",
          name: "rh"
        }
      ]
    },
    _type: "DOCUMENT",
    _id: {
      $oid: "55c1e7c41c49a8cd78818bc7"
    },
    name: "Anupama",
    city: "Trichy",
    age: 25,
    _etag: {
      $oid: "55c1e7c41c49a8cd78818bc8"
    },
    _lastupdated_on: "2015-08-05T10:39:00Z",
    _created_on: "2015-08-05T10:39:00Z"
  },
  {
    _embedded: {

    },
    _links: {
      self: {
        href: "/jaydb/employees/55c1e7ae1c49a8cd78818bc5"
      },
      rh: coll: {
        href: "/jaydb"
      },
      curies: [
        {
          href: "http://www.restheart.org/docs/v0.10/#api-doc-{rel}",
          name: "rh"
        }
      ]
    },
    _type: "DOCUMENT",
    _id: {
      $oid: "55c1e7ae1c49a8cd78818bc5"
    },
name: "Sujatha",
city: "Chennai",
age: 24,
    _etag: {
      $oid: "55c1e7ae1c49a8cd78818bc6"
    },
    _lastupdated_on: "2015-08-05T10:38:38Z",
    _created_on: "2015-08-05T10:38:38Z"
  },
  {
    _embedded: {

    },
    _links: {
      self: {
        href: "/jaydb/employees/55c1e7981c49a8cd78818bc3"
      },
      rh: coll: {
        href: "/jaydb"
      },
      curies: [
        {
          href: "http://www.restheart.org/docs/v0.10/#api-doc-{rel}",
          name: "rh"
        }
      ]
    },
    _type: "DOCUMENT",
    _id: {
      $oid: "55c1e7981c49a8cd78818bc3"
    },
    name: "Soniya",
    city: "Ernakulam",
    age: 22,
    _etag: {
      $oid: "55c1e7981c49a8cd78818bc4"
    },
    _lastupdated_on: "2015-08-05T10:38:16Z",
    _created_on: "2015-08-05T10:38:16Z"
  },
  {
    _embedded: {

    },
    _links: {
      self: {
        href: "/jaydb/employees/55c1e7711c49a8cd78818bc1"
      },
      rh: coll: {
        href: "/jaydb"
      },
      curies: [
        {
          href: "http://www.restheart.org/docs/v0.10/#api-doc-{rel}",
          name: "rh"
        }
      ]
    },
    _type: "DOCUMENT",
    _id: {
      $oid: "55c1e7711c49a8cd78818bc1"
    },
    name: "Reshma",
    city: "Trivandrum",
    age: 21,
    _etag: {
      $oid: "55c1e7711c49a8cd78818bc2"
    },
    _lastupdated_on: "2015-08-05T10:37:37Z",
    _created_on: "2015-08-05T10:37:37Z"
  },
  {
    _embedded: {

    },
    _links: {
      self: {
        href: "/jaydb/employees/55c1d3a8b216e0710f8ee0ab"
      },
      rh: coll: {
        href: "/jaydb"
      },
      curies: [
        {
          href: "http://www.restheart.org/docs/v0.10/#api-doc-{rel}",
          name: "rh"
        }
      ]
    },
    _type: "DOCUMENT",
    _id: {
      $oid: "55c1d3a8b216e0710f8ee0ab"
    },
     name: "Michael",
     city: "Tokyo",
     age: 23,
    _created_on: "2015-08-05T09:13:12Z"
  }
]

}, _links: {

  },
  _type: "COLLECTION",
  _id: "employees",
  _created_on: "2015-08-05T09:38:36Z",
  _etag: {
    $oid: "55c1d99c1c49a8cd78818bb6"
  },
  _lastupdated_on: "2015-08-05T09:38:36Z",
  _collection-props-cached: false,
  _returned: 5
}

Ref:

Answer №1

RESTHeart utilizes the HAL format and you can explore the resource representation section in the restheart documentation for further details.

To summarize, when making a GET request to a collection resource, the response will include the collection's properties at the top level along with its documents as embedded resources.

You can access the collection's documents through the _embedded property which contains an array called rh:doc; each element in this array represents a document.

It is important to note that the documents are paginated by default, with RESTHeart returning the first 1000 documents. You have the ability to manage pagination using the page and pagesize query parameters.

If you include the count query parameter, you will receive the _size and _total_pages properties.

The _links parameter will provide the next and potentially the previous links directing you to the following or previous page.

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 way to increase the value of a variable using jQuery?

As I work on adding dates to a slider, I find myself needing to increment the values with each click. Initially, I start with the year - 2. $('#adddates').click(function() { var year = 2; $("#slider").dateRangeSlider({ bounds: { ...

Merge Razor with Ajax and JSON

I have been struggling to get the following components to work together without success. The goal is to populate the mediaId's combobox with respective values based on the selection in the target combobox. Currently, I am only simulating the values fo ...

Is Node.js going to continue to provide support for its previous versions of node modules?

I currently have a website that relies on the following dependencies. While everything is working smoothly at the moment, I can't help but wonder about the future support of these packages by node.js. I've looked into the legacy documentation of ...

Establish communication between two Sails applications

I am currently working on a Sails.js project that features a member portal with all possible routes and actions. However, I am considering developing a CMS using Sails as well. Originally, my plan was to integrate the CMS into the existing project, but n ...

Reversing the Jquery checkbox functionality

Seeking some quick assistance here. I'm puzzled as to why this function seems to be working in reverse. Whenever I try to check the checkboxes, they all get unchecked and vice versa. Everything was functioning smoothly until I introduced the .click() ...

Utilizing Font Awesome icons dynamically presents challenges when integrating with SVG & JavaScript

Recently, I started using the new JS&SVG implementation of font-awesome's v5 icons. It seems to be working perfectly for icons (such as <i class='fas fa-home'></i>) that are already present in the DOM at page load. The <i& ...

Obtain embedded objects within a MongoDB record based on conditions specified in the parent and child linked documents

Below is a description of a user structure in MongoDB document format. { "_id" : ObjectId("588db8c76b1d3032105a8faf"), "uid" : "123456", "groups" : [{_id : "1", "uid" : "123"}, {_id : "1", "uid" : "258"}, {_id : "1", "uid" : "296"}], "conn ...

Displaying a singular item using ng-repeat

Within my main ng-repeat div, I have a specific div that should display only one matching value. However, my current approach is causing the same value to be duplicated in every instance because it is within the main ng repeat loop. What alternative soluti ...

Utilize the HTTP path to designate the currently active tab

Here is a sample code snippet for vertical tabs in React using the Material-UI library: import * as React from 'react'; import Tabs from '@mui/material/Tabs'; import Tab from '@mui/material/Tab'; import Typography from '@ ...

The ultimate guide to loading multiple YAML files simultaneously in JavaScript

A Ruby script was created to split a large YAML file named travel.yaml, which includes a list of country keys and information, into individual files for each country. data = YAML.load(File.read('./src/constants/travel.yaml')) data.fetch('co ...

Angular's radio button is set to "checked" on a pre-configured model

Looking for help with customizing alignment of images in a bootstrap/angular template? Check out the code snippet below: <div ng-repeat="a in attributes"> <div class="btn-group" data-toggle="buttons"> <label class="btn btn-white ...

The 404 error is handled by the express application before continuing to other routes. Some routes may not be recognized by the express.Router module

Shown below is the content of app.js: var express = require('express'); var routes = require('./routes/index'); app = express(); app.use('/', routes); // catch 404 and forward to error handler app.use(function(req, res, next ...

Issue with Angular variable not showing desired value

It seems like I'm missing something simple here, but my brain is not cooperating at this late hour. Can someone else take a look and help me out? Here's the HTML snippet in question: <html> <head> <base href="/"> <script sr ...

Difficulty in adding a simple return to render an array in React for list creation

After establishing a basic object, I noticed that it contained an internal object named "orders" with an array of toppings like "Cheese" and "Bacon". To further explore this structure, I segregated the array and directed it to a function called renderToppi ...

Is it possible to conditionally call the Apollo Client in my Vue template script?

I have a scenario where I pass a query to the apollo client in my template file using a script tag. However, I want to find a more efficient way to handle this without having to specify the query every time. My idea is to pass a boolean value through a pro ...

Transforming an array of HTTP Observables into an Observable that can be piped asynchronously

I am attempting to execute a series of XHR GET requests based on the results of an initial request. I have an array of observables representing the secondary requests I wish to make, and I am able to utilize Array.map for iterating over them and subscribin ...

What could be causing my Node application to give a 404 error when making a POST request?

I'm at a loss trying to debug my app for what seems like a simple error, but I just can't locate it. Here is an overview of how my Express app is structured. My routes are set up as follows: var routes = require('./routes'); ... app.g ...

What is the method for defining the current date variable within a .json object?

When using a post .json method to send an object, I encounter the following situation: { "targetSigningDate": "2021-09-22T21:00:00.000Z" } The "targetSigningDate" always needs to be 'sysdate'. Rather than manually c ...

Get canvas picture through JS Jquery

I've been attempting to save a canvas image to my desktop using this code: <script type="text/javascript"> var canvas; $(document).ready(function() { if ($('#designs-wrapper').length) { $('.design').eac ...

Unable to render data in HTML page using Vue component

home.html: <body> <div id="app"> {{ message }} </div> <div id="counter"> {{ counter }} </div> <script type="text/javascript" src="https://cdn.js ...