Moderné webové technológie 6 - Angular - Material tabuľka a TD validácia

Zhrnutie prednášky

Prednáška nadväzuje na predchádzajúce vytváranie komponentu s rozšírenými používateľmi v Angulari a zameriava sa na pokročilejšiu prácu s Material tabuľkou. Vysvetľuje rozdiel medzi jednoduchým definovaním stĺpca pomocou mat-text-column a zložitejšou definíciou cez ng-container s mat-column-def, mat-header-cell-def a mat-cell-def, ktorá umožňuje ľubovoľné spracovanie hodnôt entity. Na príklade stĺpca last_login je demonštrované použitie vstavanej Angular pipe date na formátovanie dátumu vrátane predefinovaných formátov aj vlastného skladania formátu zo znakov. Následne sa pridáva stĺpec groups, pričom sa ukazuje problém so zobrazením objektov namiesto ich mien, čo vedie k rozhodnutiu vytvoriť vlastnú pipe s názvom groups-to-string, ktorá bude vedieť podľa parametra permissions vypisovať buď názvy skupín, alebo priradené práva. Na záver sa začína proces generovania novej pipe cez Angular CLI v adresári pipes.

• - Rekapitulácia architektúry: komponent App, router, servisy pre chyby a komunikáciu s REST serverom (UserServerService)
• - Použitie localStorage na uchovanie tokenu a používateľa naprieč reštartmi stránky
• - Observable (BehaviorSubject-like premenná) na informovanie navbaru o prihlásenom používateľovi
• - Definícia jednoduchého stĺpca cez mat-text-column vs. pokročilá definícia cez ng-container s mat-column-def/mat-header-cell-def/mat-cell-def
• - Formátovanie dátumu pomocou vstavanej Angular pipe date (preddefinované formáty aj custom formát)
• - Kritika natívnych JavaScript dátumových funkcií kvôli nekonzistentnosti medzi prehliadačmi
• - Pridanie stĺpca groups do tabuľky a problém zobrazenia objektov namiesto textových hodnôt
• - Plán vytvorenia vlastnej pipe groups-to-string s voliteľným parametrom permissions na výpis mien skupín alebo práv

Zhrnutie pripravené s pomocou AI z prepisu videa.