Потврдите унос података помоћу АнгуларЈС -а

Када радимо на изградњи апликација са једном страницом, једна од тачака коју можемо истаћи је унос података, ова врста функционалности се обично ради помоћу образацОчигледно, ако ћемо тражити податке од корисника, морамо потврдити да они не садрже грешке.
срећом АнгуларЈС Има неке интерне механизме који нам омогућавају да вршимо валидацију на једноставан начин, омогућавајући тако слање обрасца само када су испуњени услови за формат података.
Прва ствар која ће нам требати је а образац, поставићемо нека поља, на пример име, презиме и поље е -поште, генерално, ово су најчешће коришћени типови поља и то ће нам дати прилику за генерисање валидација. Погледајмо почетни код који имамо:

Име:Презиме:Е-маил:Старост:Пошаљи

Ако погледамо, користили смо карактеристике ХТМЛ да потврдите поља, на пример постављањем својства потребан за обавезна поља мислиће да ће ово радити само у новијим или компатибилним прегледачима ХТМЛ5 само, али када користимо АнгуларЈС, ово ће испунити алтернативне провере ако апликацију отворимо у прегледачу који није компатибилан са ХТМЛ5.
Видимо да поље старости, осим потврде типа, има и два својства АнгуларЈС који су за дужину поља, то значи да можемо поставити само бројеве између 1 и 3 цифре укупно.
До сада смо добро радили с нашом вјежбом, међутим морамо и даље потврдити да за слање података све мора бити потврђено, за то морамо генерирати контролер који нам то омогућава, за то ћемо назначити у облику који контролер ће користити, променићемо ред:

На следећи начин:

Унутар контролера можемо приступити својству званом $ валид, који ће означити да ли је наш образац важећи за слање података, за то морамо изменити ред дугмета за слање података са следећим:

Пошаљи

Измена треба да се изврши на следећи начин:

Пошаљи

Коначно, можемо створити наш контролер у АнгуларЈС -у са којим ћемо обрадити наше податке:

 функција АддЦонтроллерУсер ($ опсег) {$ сцопе.мессаге = ''; $ сцопе.аддУсер = фунцтион () {$ сцопе.мессаге = 'Хвала,' + $ сцопе.усер.наме + ', додато је!'; }; } 

Ово би требало да нам да резултат као што је овај у нашем прегледачу:

Видимо да пошто нема података, дугме за слање је онемогућено, то ће се променити када попунимо одговарајуће податке као што видимо на следећој слици:

Да смо поставили поруку е -поште са нетачним форматом, дугме не би било активирано, онда видимо како АнгуларЈС Омогућило нам је развој у нечему тако једноставном као што је форма и овим смо завршили овај водич, успели смо да потврдимо образац на потпун начин, само користећи својства ХТМЛ5 И мало АнгуларЈС.Да ли вам се допао и помогао овај водич?Можете наградити аутора притиском на ово дугме да бисте му дали позитиван поен