• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Angular - Custom Input

Object Storage Arubacloud
+1 głos
55 wizyt
pytanie zadane 24 marca 2020 w JavaScript przez String Gaduła (4,520 p.)

Cześć :)

W Angularze, aby tworzyć customowe kontrolki można wykorzystać ControlValueAccessor. Dzięki niemu, na customowym elemencie możemy zrobić bindowanie reaktywnej kontrolki poprzez formControlName = 'name'. Po zaimplementowaniu metod z interfejsu ControlValueAccessora mamy połączenie w obie strony z inputem oraz kontrolką. Jednakże problem pojawia się w przypadku, kiedy w customowym komponencie chciałbym otrzymać inne dane z kontrolki oprócz samej jej wartości (np. pole errors). Z tego co do tej pory udało mi się znaleźć to za pomocą ControlValueAccessora możemy przekazać tylko wartość lub w przypadku ValidationProvidera z komponentu ustawić errory dla reaktywnej kontrolki, ale już nie odczytać.

Ogólnie udało mi się uzyskać efekt jaki chce - połączenie kontrolki z customowym inputem wraz z odczytaniem errorów itd. Ale rozwiązanie to polega na tym, że przekazuje sobie do customowego inputa po prostu referencję do całego obiektu FormControl np. 
 

<custom-input
    [myControl]='form.get('controlName')
></custom-input>

Następnie w custom-input subskrybuję się.

this.formControl.statusChanges.subscribe(data => {
 // read value, errors etc.
});

Jednakże czy takie rozwiązanie jest ok ? :)
Poniższy zapis:
 

<custom-input
   formControlName='nameControl'
></custom-input>

Wydaje mi się bardziej elegancki, ale jak wspomniałem wcześniej - jest problem z odczytaniem errorów, które chcę wyświetlać w cutom-input, a nie w rodzicu poprzez sprawdzenie błędów z jakiegoś formGroup.

<p *ngIf="form.get('nameControl').invalid> ... </p>

Mam nadzieję, że ktoś zrozumie o co mi chodzi :D
Pozdrawiam :)

Zaloguj lub zarejestruj się, aby odpowiedzieć na to pytanie.

Podobne pytania

+2 głosów
1 odpowiedź 411 wizyt
pytanie zadane 5 maja 2023 w JavaScript przez mm Użytkownik (890 p.)
+2 głosów
1 odpowiedź 236 wizyt
pytanie zadane 2 maja 2023 w JavaScript przez mm Użytkownik (890 p.)
0 głosów
0 odpowiedzi 101 wizyt
pytanie zadane 24 kwietnia 2023 w JavaScript przez TheDarkSide Użytkownik (930 p.)

92,581 zapytań

141,433 odpowiedzi

319,666 komentarzy

61,966 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...