Create a service

[web-dave]

generiere einen Service

Lokal

ng g service swapi/api

Online

1. Rechtsklick auf den src Ordner in der Projekt Section.
2. Klick auf Angular Generator
3. Service auswählen
4. Name SwapiApi im Promt eingeben und bestätigen
5. Dann den Service per mouse drag 'n drop nach src/app/swapi verschieben

ToDos

1. Definiere die Methode um die Entitäten aus der API abzufragen
2. Trage den SwapiApiService in das SwapiModule providers array ein
3. Schreibe ein Interface zur Typisierung des Results

ApiService

```ts import { HttpClient } from '@angular/common/http'; import { Injectable } from '@angular/core'; @Injectable({ providedIn: 'root', }) export class ApiService { private urls: { [key: string]: string } = { films: 'https://swapi.dev/api/films/', people: 'https://swapi.dev/api/people/', planets: 'https://swapi.dev/api/planets/', species: 'https://swapi.dev/api/species/', starships: 'https://swapi.dev/api/starships/', vehicles: 'https://swapi.dev/api/vehicles/', }; constructor(private http: HttpClient) {} getList(name: string) { return this.http.get(this.urls[name]); } } ```

Interface

```ts export interface ISwapiResponse { count: number; next: string | null; previouse: string | null; results: { [key: string]: string | string[] }[]; } ```

Hint

Type

```ts { [key: string]: string } // Object mit Strings als Keys und die Values sind Strings { [key: string]: string | string[] } // Object mit Strings als Keys und die Values sind Strings ODER Array mit Strings { [key: string]: string | string[] }[] // Liste mit Objecten mit Strings als Keys und die Values sind Strings ODER Array mit Strings ```

[web-dave]

Next