#javascript #angular
#javascript #angular
Вопрос:
У меня есть приложение Angular, которое вызывает rest api, но эти данные rest api определяются тем, на какого клиента это похоже: api/incident?customer_id=7
Как бы мне отразить это в URL-адресе api или сервисе? а мое приложение? Мой сервис заключается в следующем:
import { Injectable } from '@angular/core';
import { HttpClient, HttpEventType, HttpHeaders, HttpRequest, HttpResponse, HttpErrorResponse } from '@angular/common/http';
import { HttpClientModule } from '@angular/common/http';
import { Observable, of, throwError } from 'rxjs';
import { catchError, retry } from 'rxjs/operators';
@Injectable({
providedIn: 'root'
})
export class
nowService {
serviceApiUrl: string = 'api/incident';
constructor(
private http: HttpClient,
) { }
getAll(): Observable<any> {
return this.http.get<any>(this.serviceApiUrl)
.pipe(
catchError(this.handleError)
);
}
private handleError(error: HttpErrorResponse) {
if (error.error instanceof ErrorEvent) {
console.log(error.error.message)
} else {
console.log(error.status)
}
return throwError(
console.log('Something has happened; Api is not working!'));
};
}
component.ts
import { Component, OnInit } from '@angular/core';
import { HttpClient, HttpEventType, HttpHeaders, HttpRequest, HttpResponse } from '@angular/common/http';
import {HttpClientModule} from '@angular/common/http';
// Services
import { nowService } from '../../services/servicenow.service';
import { Incidents } from '../../models/incidents.model';
@Component({
selector: 'app-service-incident',
templateUrl: './service-incident.component.html',
styleUrls: ['./service-incident.component.scss']
})
export class ServiceIncidentComponent implements OnInit {
public incidents: any;
public loading = true;
public errorApi = false;
constructor(private service: nowService) {
}
ngOnInit() {
this.service.getAll().subscribe((data) => {
this.loading = true;
this.incidents = data.result;
this.loading = false;
console.log('Result - ', data);
console.log('data is received');
})
}
}
Таким образом, он основан на параметре customer ID. Я просто хочу знать, как это сделать, поскольку я не сталкивался с этим раньше?
Спасибо
Комментарии:
1. Просто добавьте его в конец serviceApiUrl. Это ваш собственный API? В API будут обрабатываться параметры строки запроса
2. Пример этого? было бы
api/incident?customer_id
Ответ №1:
Код может быть следующим:
getAll(customerId): Observable<any> {
return this.http.get<any>(this.serviceApiUrl "?customer_id" customerId )
.pipe(
catchError(this.handleError)
);
ngOnInit() {
this.service.getAll(this.customerId).subscribe((data) => {
this.loading = true;
this.incidents = data.result;
this.loading = false;
console.log('Result - ', data);
console.log('data is received');
})
}
Или вы можете использовать класс HttpParams
пример:
https://angular.io/api/common/http/HttpParams
getAll(customerId): Observable<any> {
const params = new HttpParams("customer_id", customerId)
return this.http.get<any>(this.serviceApiUrl ,{ params })
.pipe(catchError(this.handleError));
Комментарии:
1. Каким будет мой service api?
serviceApiUrl: string = 'api/incident';
2. Будет ли это то же самое?
3. @Sole да, ваш serviceApiUrl по-прежнему будет
'api/incident';
4. Оператор Return для GetAll() должен быть
return this.http.get<any>(this.serviceApiUrl "?customer_id=" customerId )
5. Вы также могли бы написать это как:
return this.http.get<any>(`${this.serviceApiUrl}?customer_id=${customerId}`)