Kuinka toteuttaa muodon vahvistus kulma-JS: ssä?

Vahvistus on menetelmä todentaa käyttäjä. Sitä käytetään kaikissa verkkotekniikoissa, kuten ja . Mutta tänään keskitymme validointiin kulma-JS: ssä seuraavassa järjestyksessä:

• Mikä on lomakkeen vahvistus?
• Lomakkeen vahvistus kulmassa JS
• Lomakkeen validoinnin vaiheet
• Koodi

Mikä on lomakkeen vahvistus?

Lomakkeen vahvistus on tekniikka, jolla voimme vahvistaa HTML-lomakkeen. Otetaan yksinkertainen esimerkki siitä, että käyttäjällä on HTML-muoto ja että HTML-lomakkeella on erilaisia ​​kenttiä. Nämä kentät validoidaan lomakkeen validatorilla, kun haluamme vahvistaa lomakkeen, meidän on vain tarkistettava tietyn kentän arvo validointilausekkeella .

Jos säännöllinen lauseke ja kentän arvo ovat samat, voimme sanoa, että muoto on vahvistettu. HTML-lomakkeessa on erityyppisiä tarkistuksia, kuten sähköposti, vaadittu, min, max, salasana jne.

Lomakkeen vahvistus kulmassa JS

Puhutaan siitä, kuinka voimme vahvistaa muodon kulmikkaalla JS: llä. Kulma-JS tarjoaa erityyppisiä lomakkeen vahvistusominaisuuksia, joita voimme käyttää lomakkeen vahvistamiseen tai tietojen saamiseen lomakkeesta.

• $ voimassa : Tämä ominaisuus kertoo, onko kenttä kelvollinen, soveltamalla siihen asianmukaista sääntöä.

• $ virheellinen : Kuten nimi sanoo virheelliseksi, tämä ruutu säätä, kenttä on virheellinen tai ei perustu asianmukaiseen sääntöön.

• $ koskematon : Se palauttaa arvon tosi, kun lomakkeen syöttökenttää ei käytetä.

  
  
  

• $ likainen : Se palauttaa arvon tosi, kun lomakkeen syöttökenttää käytetään.

• $ kosketti : Totuus, jos tulo on epäselvä.

Lomakkeen käyttö: .

Tulon käyttäminen: ..

Selitetään nyt lomakkeen vahvistus kulmallisessa JS: ssä esimerkillä, joten ensin tehdään kaksi tiedostoa, yksi on app.js ja toinen index.html. Index.htm-tiedosto sisältää yksinkertaisen HTML-lomakkeen, jolla on kulmainen vahvistus, ja app.js-tiedostossamme on taustakoodi, joka käsittelee lomakkeen validoinnin index.html-sivulla.

index.htmlsivun sisältö muodostaanovalidaattiomaisuus ja mitä se tarkalleen tarkoittaa?

Lomaketunnisteen novalidate-ominaisuus kertoo HTML: lle, että voimme käyttää mukautettua lomaketarkistusta. Jos emme anna novalidate-ominaisuutta, ja HTML-muoto vahvistetaan käyttämällä HTML5: n oletuslomakkeen validointiominaisuuksia.

Lomakkeen validoinnin vaiheet

Lomakkeessamme olemme luoneet lomakkeeseen 6 kenttää, jotka ovat etunimi, sukunimi, sähköpostiosoite, puhelin, salasana ja viesti.

1. Ensin lisätään vaadittu kentän vahvistaja, tämä vahvistaja kertoo käyttäjille, että tietty kenttä vaaditaan.

2. Seuraava on sähköpostikenttä, jos käyttäjä ei anna kelvollista sähköpostia, sähköpostivahvistin heittää sähköpostin vahvistusvirheen.

   asenna php Windows 8: een

3. Asetamme salasanan vahvistuksessa vähimmäis- ja enimmäispituuden. Pienin pituus on 5 ja suurin pituus 8, jotta käyttäjä voi antaa kelvollisen salasanan, joka on 5-8 merkkiä.

4. Lopuksi asetamme vaaditut puhelimet ja viestikentät ja nimenomaan sovellamme numeroiden vahvistusta arkistoituun puhelimeen.

Lomakkeen validointikoodi kulma-JS: ssä

index.html

Kulma-alueen esimerkki Etunimi 
 
Tämä arkistointi vaaditaan
Sukunimi 
 
Tämä arkistointi vaaditaan
Sähköposti 
 
Tämä arkistointi vaaditaan
 
Virheellinen sähköpostiosoite
Puhelin 
 
Tämä arkistointi vaaditaan
 
Tämä ei ole kelvollinen puhelin
Salasana 
 
Tämä arkistointi vaaditaan
 
Salasana 5-8 merkkiä
Viesti 
 
Tämä arkistointi vaaditaan
Lähetä

app.js

var app = kulmamoduuli ('ngValidApp', []) app.controller ('ngValidController', funktio ($ -alue) {})

Puhutaan joistakin validointidirektiivistä, jota käytetään muodossa:

• vaaditaan : Vaaditun kentän toimittamisesta
• ng-show : Virhesanoman näyttäminen ehdon perusteella (tarkista vahvistusominaisuudet)
• minimi pituus : Vähimmäispituuden tarjoamiseksi
• ng-maksimipituus : Suurimman pituuden tarjoamiseksi
• kuvion : Tietyn mallin vastaamiseksi
• ng-malli : Sitoo kentän vahvistusominaisuuksilla, kuten $ error, $ valid jne.

Tämän avulla olemme päättyneet tämän vahvistus Angular JS -artikkelissa. Toivon, että sait ymmärryksen erilaisista asioista, jotka on otettava huomioon lomakkeen validoinnissa kulmikas JS: ssä.

Jos haluat oppia lisää kulmakehyksestä, tutustu meidän joka sisältää ohjaajan vetämän live-koulutuksen ja tosielämän projektikokemuksen. Tämä koulutus auttaa sinua ymmärtämään kulma syvällisesti ja auttaa saavuttamaan aiheen hallinnan.

Onko sinulla kysymys meille? Mainitse se tämän artikkelin kommenttiosassa ja palaamme sinuun.