Angular lägga till element i lista

Permalänk
Medlem

Angular lägga till element i lista

Hej!
Håller på att jobba på en sida som visar utrustningar i ett nät. Jag har en vy som visar själva huvudutrustningen just nu. Tanken är att om jag klickar på en knapp så ska utrustningens barn hitta in i den här listan precis under huvudutrustningen.

En liten illustration:

Jag är nyfiken på hur jag kan få in detta med hjälp utav angular om det är möjligt. Uppskattar alla möjliga tankar som kommer.

edit: La till bild
Mvh

Visa signatur

Crosshair IV | 1055T @ 3.2 GHz | 4 GB Corsair dominator | Corsair H50 | Fractal Design R3 | 2x PowerColor 6950 2GB | Corsair HX 750W

Permalänk
Medlem

Varför inte ha dem med från början och dölja dem? Sen när du trycker så expanderar du dem?
Eller har jag missat "grundfunktionaliteten"?

Visa signatur

Stationär: Ryzen 5700X, 32Gb ram (3600Mhz), 6700XT
Emuleringsmaskin: Ryzen 5700G, 16Gb ram (3600Mhz)
Surfplatta/Telefon: Xiaomi Mi Pad 5, Realme X3.

Permalänk
Medlem
Skrivet av snebulan:

Varför inte ha dem med från början och dölja dem? Sen när du trycker så expanderar du dem?
Eller har jag missat "grundfunktionaliteten"?

Jag hade också gjort så här, då det inte verkar som om det kommer vara så mycket data. Om man har väldigt långa listor kan det vara bra att ladda den datan man behöver bara dock

Till trådskaparen: Angular är ju trevligt på så sätt att du bara databinder din vy till en lista i controllern. Så när du ändrar i listan i bakgrunden så ändras vyn automatiskt. Så skapa en lista i din controller med den strukturen du vill ha och databind till din vy så kommer strukturen funka som du vill. Så får du lägga på ytterligare lite kod för att få expand/collapse-funkionalitet

Permalänk
Medlem
Skrivet av snebulan:

Varför inte ha dem med från början och dölja dem? Sen när du trycker så expanderar du dem?
Eller har jag missat "grundfunktionaliteten"?

Skrivet av tobijoh:

Jag hade också gjort så här, då det inte verkar som om det kommer vara så mycket data. Om man har väldigt långa listor kan det vara bra att ladda den datan man behöver bara dock

Till trådskaparen: Angular är ju trevligt på så sätt att du bara databinder din vy till en lista i controllern. Så när du ändrar i listan i bakgrunden så ändras vyn automatiskt. Så skapa en lista i din controller med den strukturen du vill ha och databind till din vy så kommer strukturen funka som du vill. Så får du lägga på ytterligare lite kod för att få expand/collapse-funkionalitet

Tack för inputen. Det är väldigt mycket data som ska in om allt ska med från början. Själva strukturen är inte den enklaste att få till då informationen på diverse barntyper är olika. Om jag minns rätt så ska nog inte alla fält vara med så jag kan nog skala av de bitarna som inte är likadana på alla enheter.

Skulle det funka att ha en array och där index [0->n] representerar id på föräldern och barnen ligger under denna? Det känns som att det hade blivit ett bra sätt att få in datat? Att använda splice på huvudarrayen skulle väll funka minst lika bra?

Visa signatur

Crosshair IV | 1055T @ 3.2 GHz | 4 GB Corsair dominator | Corsair H50 | Fractal Design R3 | 2x PowerColor 6950 2GB | Corsair HX 750W

Permalänk
Medlem
Skrivet av Dalgren:

Tack för inputen. Det är väldigt mycket data som ska in om allt ska med från början. Själva strukturen är inte den enklaste att få till då informationen på diverse barntyper är olika. Om jag minns rätt så ska nog inte alla fält vara med så jag kan nog skala av de bitarna som inte är likadana på alla enheter.

Skulle det funka att ha en array och där index [0->n] representerar id på föräldern och barnen ligger under denna? Det känns som att det hade blivit ett bra sätt att få in datat? Att använda splice på huvudarrayen skulle väll funka minst lika bra?

Det låter inte helt rätt, snarare som ett dåligt sätt att missbruka index på. Du vill antingen ha ett objekt eller en array av objekt. Om du väljer det förstnämnda låter du förälder-idt representera nyckel och datan värdet. Om det är viktigt att datan har en viss inbördes ordning kan du använda det sistnämnda istället; det skulle i så fall se ut ungefär så här:

[ { parentId: 4, stuff: { … } }, { parentId: 9, stuff: { … } } ]

Visa signatur

Kom-pa-TI-bilitet