Marco Pagano Marco Pagano -4 years ago 125
Node.js Question

AngularJS displaying MongoDB data

I've a problem with the interact of AngularJS and MongoDb.
I use NodeJS and ExpressJS on the server-side. With Mongoose I talk to Mongo.
I've just done the routes.

index.js

app.get('/api/dashboard', function (req, res) {

Homepage
.find({}, 'title -_id createdBy allbids.bid endTime')
.exec(function (err, auctions) {
if(err)
res.send(err);
console.log(auctions);
res.json(auctions);
})
});


The console display all the fields that i need.

Then I pass on the front-end. I use Angular route in this way:

var app = angular.module('auction', [ 'ngRoute','HomeCtrl','NewAuctionCtrl', 'FollowingAuctionsCtrl', 'MyAuctionsCtrl']);


app.config(function ($routeProvider, $locationProvider)
{

$routeProvider

.when('/', {
templateUrl: 'views/partials/dashboard.html',
controller: 'HomeController'
})



$locationProvider.html5Mode(true);


});


And my HomeController is this:

angular.module('HomeCtrl', [])
.controller('HomeController',function ($scope, $http) {
 $http.get('/api/dashboard').then(function(data) {
console.log(data);
$scope.auctions= data;

})
});


In the dashboard.html

<div class="panel panel-default" ng-controller="HomeController">
<div class="panel-heading">All The Auctions</div>
<div class="panel-body">
<ul class="list-group">
<li class="list-group-item" ng-repeat="auction in HomeController.auctions">
{{auction}}
</li>
</ul>
</div>




It doesn't work. I need only to use
{{auction.title}}
instead of
{{auction}}
??

Answer Source

Assuming your data is being successfully fetched from the server, you can do

<div class="panel panel-default" ng-controller="HomeController">
  <div class="panel-heading">All The Auctions</div>
    <div class="panel-body">
      <ul class="list-group">
        <li class="list-group-item" ng-repeat="auction in auctions">
          {{auction}}
        </li>
     </ul>
   </div>
 </div>

It doesn't need to be HomeController.auctions. This will put the entire auction object into that li, so depending on what you're trying to do you may want to do something like {{auction.title}} as you mentioned

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download