✅ Endre DOM med AngularJS

Innholdsfortegnelse

Vi kan forlenge driften av HTML gjennom atferdsendring og tretransformasjoner SOL, med dette kan vi endre elementer, legge til nye stiler og andre handlinger som lar oss utvikle et mer dynamisk brukergrensesnitt, for dette må vi gjøre bruk av direktiver.
Til dette kan vi bruke direktiver egen av AngularJSMen hvis vi trenger noe som vi ikke kan oppnå innfødt, kan vi skrive våre egne direktiver, med dette vil vi kunne lytte og svare på nettleserhendelser eller bare gjøre ting som det ikke gjør. AngularJS misligholde.
Når du utvikler en applikasjon med AngularJS det vil være noen anledninger der vi vil støte på situasjoner der innfødte direktiver ikke er i samsvar med vår ide om hva koden vår bør gjøre, til tider som dette kan vi appellere for bygge våre egne direktiver.
For å definere et nytt direktiv kan vi følge følgende formel:

 var moduloApp = angular.module ('moduloApp', […]); moduloApp.directive ('Direktivnavn', Direktivmetode);

Som vi kan se, trenger vi bare å definere modulen der vi skal anvende direktivet vårt, og deretter må vi angi navnet og metoden det må utføre.
HTML 5 har en veldig interessant funksjonalitet som er autofokus, dette lar oss fokusere et inngangselement i et skjema, og dermed bidra til å definere banen for en bruker, men hva skjer hvis vi ikke har HTML 5 og vi ønsker ikke å fokusere på et innspill, for det er der det spiller inn AngularJS og direktivene, med et direktiv kan vi løse denne situasjonen på en enkel måte.
Hva skal vi gjøre?Først må vi bygge et tilpasset direktiv ved hjelp av skjemaet som vi har angitt tidligere, med dette etablerer vi ønsket oppførsel, i dette tilfellet autofokus. Så takket være objektet $ omfang Vi kan anvende dette direktivet på ethvert element, i tilfelle av dette eksemplet skal vi bruke det på en lenke, med dette kan vi oppleve kraften til AngularJS.
La oss se resultatet av det vi ønsker å oppnå:

For dette må vi følge følgende kode, der vi har implementert det som allerede er forklart:

 Uten fokus Med fokus{{message.text}}

Som vi kan se, etablerer vi et tilpasset direktiv i begynnelsen, dette fører til plassering av autofokus i elementet som har dette direktivet, bygger vi en kontroller som hjelper oss å oppdage endringene når vi skriver ut noen meldinger.
Med dette fullfører vi denne opplæringen, ettersom vi ser manipulasjonen av SOL det er mulig med AngularJS og takket være direktiver kan vi oppnå veldig interessante effekter.Likte og hjalp du denne opplæringen?Du kan belønne forfatteren ved å trykke på denne knappen for å gi ham et positivt poeng