Daniel Kr Daniel Kr - 8 months ago 77
AngularJS Question

How can I get a value from mongodb to an angularjs controller

I am new to Web Development and started out with a MEAN-Stack (Mongo, Express, Angular, Node).

In short, I would like to get a value from mongo into my angular controller to use multiple values from mongo in a formula like this:

value11*value12 + value21*value22 ...etc

My Problem in more detail:

  1. I already wrote with a fieldset some data into mongo:

HTML Snippet

<rzslider rz-slider-model="value11"
<md-slider flex md-discrete ng-model="value12" step="1" min="1 max="100 aria-label="rating"></md-slider

Controller.js Snippet. The rzslider comes from there https://github.com/angular-slider/angularjs-slider

The md-slider from Angular-Material

$scope.slider11 = {
options: {
showTicks: true,
hidePointerLabels: true,
hideLimitLabels: true,
stepsArray: [
{ value: 1, legend: 'Very poor' }
{ value: 2, legend: 'Poor' },
{ value: 3, legend: 'Fair' },
{ value: 4, legend: 'Good' },
{ value: 5, legend: 'Very Good' }
$scope.value12 = 40;
//Create new Article object
var article = new Articles
value11: this.value11,
value12: this.value12,

At this point everything is working and in mongo the set values get stored.

  1. In this second step I would like to get the value from the database
    into a different controller to include them in above mentioned
    formula. The only thing working so far is to recall the values like
    this in the html view directly:

HTML Snippet

{{article.value11 * article.value12}}

which works, as far as I understood thanks to a query like below.

Controller snippet

// Find a list of Articles
$scope.find = function () {
$scope.articles = Articles.query();

But ultimately I would like to recall the database values and define them as a new $scope in a controller.


So the idea behind the whole MEAN stack and more-or-less the whole frontend/backend idea is that your angular application is the frontend and you need to make a AJAX call to your Node.js service to connect to MongoDB

Think of it like this Angular <---AJAX---> Node <------> Mongo

So the first thing you need is to build a rest service (using the help of the express framework) so something like this would work

app.get('/getMongoData', function(req, res, next) {
     //code to get mongo data with Mongoose

     req.json(DataFromMongo); //returns the data in json format

Here is where you will use your backend code to grab data from the Mongo Database using the Mongoose package and return send it back using the req.json() call which is part of Express

Now that this all work you can call the data from your Angular controller with something like

$http.get('/getMongoData').then(function(response) {
      $scope.myMongoData = response.data;       

NOTE: don't forget to add $http to your controller's injection app.controller('MyController', ['$scope', '$http', function ($scope, $http) { // code }]);