Angularban, hogy kell ezt megoldani?
Van egy JSON ez pl.:
{
"id": 12,
"username": "user10",
"email": "user10@gmail.com",
"cars": [
{
"id": 30,
"name": "ZSANI TESZT"
]
}
(Mársabb sokkal, de ezt csak példának írtam.
Van egy osztály, ami legyen a példa kedvéért User és abban van pár változó meg egy lista, ami Car objektumokból áll.
Angulárnál van ez a kód az egyik komponensben.
getUserData() {
const user = this.token.getUser();
this.userService.getUser(user.id).subscribe((data) => {
this.user = data;
});
}
Majd az ehez tartozó "userService"-ben ez van, így nézki a "getUser":
getUser(theUserId: number): Observable<User> {
// URL építés a user id alapján
const userUrl = `${this.baseUrl}?id=${theUserId}`;
return this.httpClient.get<User>(userUrl);
}
... és ezen kívül van egy sima User osztályom, ami így nézki:
export class User {
id: number;
username: string;
email: string;
cars: Car[] = [];
}
...............................................................
A fenti kód lefut és a JSONból minden változó éréket megkap a User typescript object, de a listát nem.
Viszont azt vettem észre, hogy ha csinálok egy interface-t a service layerbe ahol explicit leírom a listát és arra csinálok egy külön hívást, akkor úgy feltudom tölteni a listát.
getCars(theUserId: number): Observable<Property[]> {
// URL építés a user id alapján
const userUrl = `${this.baseUrl}?id=${theUserId}`;
return this.httpClient
.get<GetResponseUser>(userUrl)
.pipe(map((response) => response.cars));
}
interface GetResponseUser {
cars: Car[];
}
Jelenleg ezt kétszer is csinálok egy get kérést a szever fele, hogy megkapjam a listát meg az objektum 1 részét.
Ez nagyon ronda és nyílván nem így kell de próbálkoztam.
Gondolom akkor is működne a dolog, ha összevonnám a két dolgot és csinálnék egy interfacet, ami mondjuk így nézki:
interface GetResponseUser {
id: number,
username: string,
email: string,
cars: Car[];
}
Viszont akkor minek van erre osztályom?
Nem lehet ennél szebben megcsinálni?
Mi a helyes megoldás ilyenkor, amikor egy olyan objectumo akarok megkapni a szervertől, amiben van egy lista (vagy akár több)?
(Ebben a példában még nem is annyira csúnya egy interface-t csinálni, de ezt csak leegyszerűsítettem a példa kedvéért, a valóságban egy sokkal nagyobb osztályról van szó, ahol elég kényelmetlen lenne egy ilyen interface-t legépelni.)
Én ismerem az Angulart, de ez elég zavaros. Felét értem kb a "mit szeretnél ebből kihozni" dologból.
Javaslom, hogy a minta kódodat töltsd fel GitHub-ra, vagy valahova, mert kód formázás vagy szerkezet nélkül elég nehéz szemmel összerakni.
Észrevétel:
Observable-re ne hívj subscribe-ot, ha nem muszály. Van ennél szofisztikáltabb megoldás is. Pl. {{ observableValue | async }}
Vagy ngOnInit-en iratkoz fel valamire, de ngOnDestroy-on meg le, különben memória szivárgásod lesz és pislogni fogsz miért lassult be a böngésző. :)
További kérdések:
Minden jog fenntartva © 2025, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!