Увод у АнгуларЈС догађаје

АнгуларЈС се може описати као ЈаваСцрипт оквир који се користи за успостављање апликација за једну страницу (СПА) за мобилне као и за веб развој. СПА је једна страница где год се знање и даље наставља слично као подршка у вези са неколико бита података који се могу прилагодити док кликнете на додатне категорије / опције. Цео овај поступак може олакшати ваш рад једноставним пуштањем трошкова, повећањем ефикасности и бржим учитавањем веб страница. У овој теми сазнаћемо о АнгуларЈС догађајима.

Коришћењем АнгуларЈС можете да радите са директивама, као и да користите ХТМЛ атрибуте једноставним везивањем података за ХТМЛ са изразима. АнгуларЈС може бити МВЦ архитектура која веб апликације чини једноставним за израду од почетка. АнгуларЈС 1.0 лансиран је 2010. године и ако данас разговарамо; најновија верзија АнгуларЈС може бити 1.7.8 која је објављена у марту 2019. АнгуларЈС је такође опен-соурце оквир којим управља Гоогле, користећи огромну заједницу програмера.

Предуслови

Пре него што кренете напред на АнгуларЈС, морате да имате основно знање о

  • ЈаваСцрипт
  • ХТМЛ
  • ЦСС

Основе АнгуларЈС

Ево основа АнгуларЈС-а

Директиве

Префикс нг значи АнгуларЈС. нг- може се описати као префикс резервисан за кутне директиве кључа. Да бисте спречили сударе, они вам могу предложити да касније не користите тачан префикс у својим директивама касније на верзији Ангулар. Нг може бити скраћеница од Ангулар.

Примјери неколико директива у АнгуларЈС

  • Нг-нова директива може се користити за производњу нове Ангулар апликације
  • Нг-упдате упдате ажурира ваше невероватне апликације И такође њихове зависности
  • Директива нг-апп може се користити за иницијализацију АнгуларЈС апликације.
  • Нг-инит директива иницијализира информације о апликацији.

Директива нг-апликације такође објашњава АнгуларЈС који је елемент „предузетник“ са АнгуларЈС апликацијом.

Изрази

  • Изрази кроз АнгуларЈС ће бити описани унутар двоструких коврчавих заграда: израз.
  • За писање израза унутар директиве: нг-бинд = "израз".

На пример

Излаз:

Цонтроллер

  • Применом АнгуларЈС-а ће контролисати једноставни контролери.
  • Контролер апликације могао би се описати нг регулатором
  • Контролер је познат као ЈС објект, конструиран са регуларним ЈС конструктором објеката.

Објасните АнгуларЈС догађаје

Различите врсте догађаја лоциране у АнгуларЈС

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

Неколико битних догађаја су следећи.

  • нг-цопи
  • нг-клик
  • нг-цут
  • нг-дблцлицк
  • нг-кеидовн
  • нг-тастер
  • нг-кеиуп
  • нг-моуседовн
  • нг-моусеентер
  • нг-моуселеаве
  • нг-моусемове
  • нг-прелазак мишем
  • нг-моусеуп
  • нг-блур

Анализираћемо комуникацију са догађајима.

Ангулар ЈС укључује глобални аутобус догађаја који вам омогућава да подижете догађаје у једном обиму и пустите остале опсеге да слушају тај догађај и реагују на њега. Можете пренети додатне аргументе догађајем како би други слушаоци могли да одговарајуће реагују на догађај. Догађаји су прилично једноставни, али постоји неколико проблема са њима.

Прво, слушајући догађај једноставно назовете методу $ он () на опсегу са параметром имена догађаја. Тада ће сваки догађај с тим именом активирати ваш повратни позив. С друге стране, подизање догађаја захтева мало планирања.

Рецимо да имам догађај који је постављен овде, у Цхилд Сцопу 1, али желимо да слушамо тај догађај у Цхилд Сцопу 2. Нажалост, то не можемо да учинимо.

Постоје две могућности за подизање догађаја у Ангулар ЈС.

Први је позив на опсег $ емисије, који догађај подиже на изворном опсегу, а затим га шаље на све домете детета.

Друга опција је да се позове домет. $ емит, који догађај подиже на почетном опсегу, а затим га шаље горе ланцу обухвата.

Али не постоји заиста глобални начин емитовања са дететовог досега. Начин да се то догоди је да се ухвати $ роотСцопе и позове $ емитирање на њему, што га шаље на све домете детета.

А сада идемо да прилагодимо наш код да он функционише са догађајима уместо наслеђених опсега. Дакле, први проблем који смо приметили да желимо да решимо неки догађај је чињеница да овде, у контролеру Каталога, ова метода регистерЦоурсе () позива притиском на податке о распореду. То није његов посао.

Додавање ставки у распоред није нешто што би требао радити каталошки контролер. Уместо тога, оно што треба да ради јесте обавештавање некога другог да се курс региструје, а затим верујте да ће други објекти додати исправке курса у распоред. Дакле, предмет који би се требао бавити распоредом је, наравно, контролер за планирање.

Па идемо на контролер распореда и додајмо слушаоца догађаја. Назваћемо курс регистрованим. Први параметар повратног позива догађају је објект догађаја, а након тога било који додатни параметар који поставите када подигнете догађај.

Дакле, планираћемо да ко год је подигао догађај, поставиће курс који је и сам подигао догађај. Тада одавде можемо да урадимо логику која је првобитно изведена методом регистерЦоурсе () овде.

Сада, уместо да се ослањамо на распоред који ће бити на опсегу $, већ ћемо скинути $ обим и тек увести услугу заказану. А будући да овде доносимо распоред, више га нема потребе стављати у наш регулатор контролера.

Дакле, ту линију можемо извући овде, преместити је на наш контролер распореда и сада ту зависност извадити из контролера регистрације.

Сада је сјајно што смо овде слушали догађај, али нико то није подигао. Место овде у регистерЦоурсе () методи на контролеру Цаталог.

Каталонски контролер не може подићи догађај који контролер распореда може преслушати јер су браћа и сестре. Дакле, оно што ћемо морати учинити је довести у зависност од $ роотСцопе.

Затим одавде можемо назвати $ роотСцопе. $ Емисија () подиже догађај који тражимо и додамо у параметар који треба бити на том догађају.

Сада имамо још једну ствар коју можемо очистити. Одмах овде зовемо $ ранге.нотифи, али већ увећавамо догађај када смо регистровали курс. Требали бисмо дозволити да неко други обрађује ову пријаву кад год се региструје било који курс.

Зато се вратимо на наш регулатор за регистрацију и додајмо му слушаоца догађаја.

И одатле можемо назвати код да обавестимо позив. Чини се много прикладнијим то учинити у оквиру контролера за регистрацију, јер је то место где дефинишемо метод нотифи ().

Провјеримо овај излаз у претраживачу и видимо како функционише.

Наше промене су успеле одлично.

Сада погледајмо код и анализирамо предности и недостатке коришћења догађаја. Прва корист коју смо приметили је да логика у сваком од контролера има неке везе са тим контролером.

Каталог контролер има логике у подизању догађаја када неко кликне дугме Региструј курс и логику о обележавању регистрованог курса. Распоред има логику за додавање ставки у распоред, а регулатор за регистрацију има логику за обавештења. Због тога ми немамо контролер који би служио тим што нема никакве везе.

Такође, наш роот контролер није препун зависности са којима нема никакве везе. Ипак, постоји неколико недостатака. Свако ко рукује догађајем може отказати тај догађај. Ово може довести до лоших грешака.

Ако неки одређени руковатељ откаже догађај, слушалац који још мора да чује о том догађају није обрађен. Прикључујемо наш контролер на те догађаје.

Недостатак догађаја је што користимо низ за име догађаја и тешко је спречити сукоб имена догађаја.

Једина заштита је добра стратегија именовања имена догађаја.

Закључак - АнгуларЈС догађаји

  • Елиминира стање сервера
  • Омогућава знање изворних апликација
  • Лако приказује логику прегледа у ЈаваСцрипт
  • Захтева иновативне информације о вештинама, као и процедуре

Препоручени чланци

Ово је водич за догађаје АнгуларЈС. Овде разговарамо о основама АнгуларЈС-а и објашњавамо АнгуларЈС догађај са примерима. Можда ћете такође погледати следеће чланке да бисте сазнали више -

  1. Испитивање јединице АнгуларЈС
  2. АнгуларЈС Арцхитецтуре
  3. АнгуларЈС Директиве
  4. Каријера у АнгуларЈС
  5. Топ 5 атрибута ХТМЛ догађаја са примерима
  6. Водич за различите ЈаваСцрипт догађаје

Категорија: