Load record by ID in the Angular

Question

Load record by ID in the Angular

Navigation

#1 by (3 votes)
#2 by (1 votes)

0

This is a brief explanation below.

By clicking on the record in the browser screen I can not load the records according to ID.

This is a detailed application below;

View the gif file

YoumaynoticethattherearetworecordsbeingloadedandwhenyouclickontherecordsitcanloadintotheURLtherecordID,whenviewingtheconsoleyounoticethatitliststherecordsofthedatabasethatareonlytwoeven.

Theproblemisthatbyputtinginthepage{{restaurant?.name}}itdoesnotprintthevalueofthebank.

IdonotknowwhatI'mdoingwrong,thisismyclassofservices;

restaurantById(id:string):Observable<Restaurant>{returnthis.http.get('${this.url}/restaurants/${name}').map(response=>response.json().restaurants).catch(ErrorHandler.handlerError)}

Thisismycomponentclassaccordingtowebpage.

ngOnInit(){this.restaurantService.restaurantById(this.route.snapshot.params['id']).subscribe(restaurant=>this.restaurant=restaurant)}

THAT IS MY REPOSITORY

I'm sorry to have put it in the box because sometimes people do not realize I've put the link from my repository.

The page is inside the restaurant-detail package and the service is the restaurant.service.ts

I'll be expecting a comeback, I need a lot of help.

SERVER REPLACE

angular

asked by anonymous 02.07.2018 / 12:26

2 answers

1

Try this:

Service

import { map } from 'rxjs/operators';
import { HttpClient } from '@angular/common/http';

constructor(private http: HttpClient) { }

restaurantById(id: string): Observable<Restaurant> {
  return this.http.get<Restaurant>('${this.url}/restaurants/${id}')
  .pipe(map(response =>  response.restaurant),
       catchError(ErrorHandler.handlerError)
  )      
}

Component

constructor(protected route: ActivatedRoute)

this.route.params.pipe(
        map(params => params['id']),
        switchMap(id=> this.restaurantService.restaurantById(id))
       .subscribe(restaurant => this.restaurant = restaurant );

02.07.2018 / 13:26

input datetime-local value How to know which variables are defined?

score 3 · Accepted Answer

Your restaurantById method is ignoring the id parameter, and using a variable that does not exist ( name ). This way he will make the request in /restaurants/ and list all the restaurants.

This is evidenced by the need to use .restaurants in the map method:

restaurantById(id: string): Observable<Restaurant> {
  return this.http.get('${this.url}/restaurants/${name}')
  .map(response =>  response.json().restaurants)
  .catch(ErrorHandler.handlerError)
}

According to the response from the posted server, the ideal implementation would be:

restaurantById(id: string): Observable<Restaurant> {
  return this.http.get('${this.url}/restaurants/${id}')
  .map(response =>  response.json().restaurant)
  .catch(ErrorHandler.handlerError)
}