Angular2 - instalacja, walidacja formularza do osobnego komponentu

Question

Witam,

Zwracam się do Angularowych ogarniaczy, mianowicie

Chciałbym zainstalować Angulara 2, jednak Aktualnie po wpisaniu odpowiedniej komendy npm instaluje się Angular 4 zgodnie z najnowszym standardem, usunąłem już Angulara 4, jednak pytanie pozostaje jak zainstalować aktualnie dwójkę?

Drugie pytanie: Jak do Angulara 2 dodać osobne biblioteki Javascriptowe? Mam podpięty Jquery datepicker oraz timepicker- gdzie to się w tym Angularze wrzuca?

Trzecie: Jak prawidłowo ładuje się osobny plik z Javascriptem?

I Czwarte ostatnie: Po walidacji formularza w Javascript chciałbym, aby sukces walidacji kierował użytkownika do osobnego komponentu- czy da się tak? Czy trzeba używać TypeScripta do tego celu?

 

Z góry dziękuję :)

Answer 1

Tak więc po kolei.

Ad.1 Angular  4 to jest właśnie najnowsza wersja angulara 2, twórcy przyjęli sobie taką konwencję że pierwsza wersja tego frameworka będzie oznaczona dwójką (tak też zaczęto go nazywać) i po każdym większym updacie będą zwiększać tę cyfrę. Inaczej mówiąc stary angular to AngularJS a nowy to Angular 2+. Instalowanie w tym momencie wersji 2 która już się przedawniła kilka miesięcy temu to jedynie same problemy, także zostań przy 4.

Ad.2 Według mnie lepiej używać bibliotek które są dostosowane do angulara, dzięki temu łatwiej współpracować z frameworkiem, Tutaj masz angularowy datepicker i timepicker razem z opisem jak dodac je do projektu i jak skonfigurować pod własne potrzeby.
https://github.com/jkuri/ng2-datepicker
https://github.com/DanielYKPan/date-time-picker

Ad. 3 Osobny plik js można załadować w najprostszy sposób, czyli używając tagów <script> w index.html.

Ad. 4 Pytanie wydaje mi się nieco dziwne, używasz angularowej walidacji czy masz może jakąś bibliotekę do tego?

Comments

Sprawa ma się tak, że dostałem zadanie rekrutacyjne dotyczące stanowiska związanego z JS, które wymaga ode mnie zrobienia prostego formularza kontaktowego zawierającego pole tekstowe, imienne, mailowe oraz koniecznie tą datę oraz godzinę. Całość ma być wykonana właśnie w JS, z pominięciem backendu i zaimplementowana do Angulara. O ile faktycznie mogę wykorzystać pluginy, które poleciłeś o tyle dodawanie osobnego pliku js do Angulara 4 w moim przypadku skutkowało wywaleniem błędu 404 file not found :( niezależnie gdzie go dodałem i wywołałem <script> czy w głównym katalogu czy w poszczególnych komponentach.

Docelowo chciałbym aby po JSowej walidacji przekierowywało do osobnego komponentu o ile to oczywiście wykonalne, ale zdaje się, że tak. Pytanie tylko czy jestem w stanie zrobić to bez używania wyłącznie TypeScripta.

Formularz mam już zwalidowany zgodnie z wytycznymi. Pozostaje mi tylko "skleić" go z angularem.
Czy taka opcja jest do zrobienia?

 

Dzięki :)

---

Wydaje mi się że źle podszedłeś do tego zadania. Nie po to ładujemy komuś do przeglądarki ponad megabajt javascript'u żeby jeszcze klepać samemu walidację :) Proponuję zerknąć do dokumentacji angulara i napisać ten formularz używając formGroup w połączeniu z formControl. To rozwiązuje też problem przekierowania bo pod zdarzenie submit formularza jedną linijką kodu możemy podpiąć dowolną funkcję i tu w zależności na ile prosta ma być ta apka możemy ukryć jeden komponent i pokazać inny albo przekierować użytkownika do innego routa. Co do samego typescriptu to nie jest wymagany ale ogromna większość deweloperów Ng2 z niego korzysta, nie zrażaj się tym że wcześniej w nim nie pisałeś, przy takiej skali projektu bez problemu sobie poradzisz nawet z podstawową wiedzą z js.

A co do zewnętrznych skryptów to jeżeli są odpowiednio podpięte w index.html to muszą działać. Status 404 oznacza że src skryptu prowadzi w złe miejsce, bez spojrzenia w kod ciężko powiedzieć o co chodzi. Być może tag <base> ma tu jakiś wpływ..