0
I don’t understand what’s wrong with my code, the code is correct, even so I can’t list the data from my Mongodb database.
This is my HTML
<div class="col-lg-12">
<h3>{{ title }}</h3>
<table class="table table-hover">
<thead class="thead-default">
<tr>
<th>Nome</th>
<th>Categoria</th>
<th>Ação</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let restaurant of restaurants">
<td>{{ restaurant.name }}</td>
<td>{{ restaurant.category }}</td>
<td>
<a class="btn btn-sm btn-success">
<span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span> Ver
</a>
<a class="btn btn-sm btn-primary">
<span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
Editar
</a>
<a class="btn btn-sm btn-danger">
<span class="glyphicon glyphicon-trash" aria-hidden="true"></span> Deletar
</a>
</td>
</tr>
</tbody>
</table>
</div>
This is my component class;
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '../../../../../node_modules/@angular/router';
import { RestaurantService } from '../../services/restaurant.service';
import { Restaurant } from '../../models/restaurant';
@Component({
selector: 'mt-list',
templateUrl: './list.component.html',
styleUrls: ['./list.component.css']
})
export class ListComponent implements OnInit {
public title: string;
public restaurants: Restaurant[];
public numbers = new Array(10);
public token;
constructor(
private _route: ActivatedRoute,
private _router: Router,
private _restaurantService: RestaurantService
) {
this.title = 'Adicionar Restaurantes';
}
ngOnInit() {
this.getRestaurants();
}
getRestaurants() {
this._restaurantService.getRestaurants().subscribe(
response => {
if (!response.restaurants) {
} else {
this.restaurants = response.restaurants;
}
},
error => {
console.log(<any>error);
}
);
}
}
And that’s the proof you’re listing, but the data doesn’t appear on screen;
Can anyone see the problem? Please! This is the class of services;
import { Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import 'rxjs/add/operator/map';
import { Observable } from 'rxjs/Observable';
import { environment } from 'environments/environment';
@Injectable()
export class RestaurantService {
public url: string;
constructor(private _http: Http) {
this.url = environment.url;
}
getRestaurants(){
return this._http.get(this.url+'/admin-painel/listas').map(res => res.json());
}
}
My back-end is the express Node it is working on my Postman;
router.get('/admin-painel/listas', controller.get);
My list of data;
I think your data is not in
response.restaurants
. Tries to give a console.log(Response) and see if it lists the data directly.– Lucas Brogni
is as undefine, please as I do to fix?
– wladyband
@ladyband if you are giving Undefined the data is not getting there. Can you put the code of your service please?
– Lucas Brogni
I just put, could I have a look please?
– wladyband
this._restaurantService.getRestaurants().subscribe(
 response => {
console.log(response) 
})
try to see if you list your data.– Lucas Brogni
I just updated my post, is coming the data, this is all very strange.
– wladyband
your JSON does not return the nested items in the restaurant tag. Try this way:
response => {this.restaurants = response;}
– Pedro
@Pedro just took the if/Else, but did not fix the problem.
– wladyband
edited my comment, remove the . Restaurants after the replay
– Pedro
@Pedro picked it up, it worked perfectly, I found it strange that this might happen :) thank you very much.
– wladyband
show! I will formulate an answer explaining why the error
– Pedro