Hvad er Angular 2?
For at oprette webapplikationer i HTML og JavaScript bruges en JavaScript-ramme, der kaldes Angular 2, som blev bygget af Google. Mens du arbejder med applikationer på én side, kunne de forhindringer, man ofte står overfor, overvindes ved hjælp af Angular 2.
Moduler i vinkel 2
I en applikation er de logiske grænser sammensat af vinkel 2. Funktionaliteterne kunne opdeles i forskellige moduler i stedet for at placere alt i én applikation. Nedenfor er nogle af de dele, som et modul er lavet af -
- For at få adgang til funktionaliteten i applikationen informeres de komponenter, der skal indlæses, til Angular JS ved hjælp af Bootstrap-matrixen. Komponenten skal deklareres i bootstrap array, så den i Angular JS-applikationen kan bruges på tværs af andre komponenter.
- Rørene, derivater, komponenter osv. Eksporteres via eksportgruppen, der skal bruges i andre moduler.
- Fra andre Angular JS-moduler kunne funktionaliteten importeres ved hjælp af importarray.
Arkitekturen af vinkel 2
Anatomien i en vinkel 2-applikation er beskrevet ved ovenstående diagram. Programmets funktionalitet defineres af hver komponent, der er den logiske grænse. Funktionaliteten på tværs af komponenter deles ved hjælp af lagdelte tjenester.
En komponent defineres af klasse, skabelon og metadata. Egenskaber og metoder består af klassen. Klassens funktionalitet udvides, og den er dekoreret ved hjælp af metadata. Applikationens HTML-visning kunne defineres ved hjælp af skabelonen.
Denne applikation har et rodmodul og flere komponenter, der adskiller funktionaliteten.
I lighed med Root Angular-modulet har funktionsmodulet flere komponenter, der distribuerer funktionaliteten.
I en Angular JS-applikation defineres det logiske stykke kode af komponenterne.
- Bindingen og derivaterne udføres af den skabelon, der indeholder applikationens HTML og gengiver visningen af applikationen.
- Egenskaber og metoder findes i klassen, der understøtter visningen af applikationen og er defineret i TypeScript. Det har klassens navn, egenskabsnavn, egenskabstype og værdi.
- Med en dekoratør defineres Metadata, som har de ekstra data.
Vinkelformede 2 funktioner
Kraften i en HTML udvides ved hjælp af et brugerdefineret HTML-element kendt som et direktiv. Direktiverne i Angular 2 er ngif og ngFor.
- Elementer føjes til HTML-koden ved hjælp af ngif-elementet i ægte scenarier, men vil ikke blive tilføjet, hvis det evalueres til usant. Repræsenteret af.
- Baseret på for-loop-tilstanden bruges ngFor-elementet.
Dataindbinding er en af funktionerne i vinkel 2. I en egenskab i en klasse kan egenskaben af et HTML-tag være en binding.
I Angular 2 er fejlhåndtering en mulighed for applikationerne. ReactJS fangstbibliotek er inkluderet, og fangerfunktionen bruges. Nedenfor er fejlhåndteringskoden.
Til Fejlhåndteringsfunktionen er linket indeholdt af fangerfunktionen. Til konsollen sendes fejlen af fejlhåndtererfunktionen. Udførelsen fortsættes, efter at fejlen er kastet tilbage i hovedprogrammet. Dette omdirigerer fejlen til konsollen.
Brugere ledes til forskellige sider ved hjælp af Routing, efter at en mulighed er valgt fra hovedsiden.
I dette kunne dataene transformeres ved hjælp af flere filtre og rør.
- At konvertere til små bogstaver.
- For at konvertere til store bogstaver.
- Fra en inputstreng kunne et stykke data skives. Skivets startposition refereres til ved start, og slutpositionen henvises ved slutningen.
- Inputstrengen kunne konverteres til datoformat ved hjælp af datafunktionen.
- Til valutaformat konverteres inputstrengen ved hjælp af valutafunktionen.
- Til procentformat konverteres inputstrengen med procentdel-funktionen.
Tilpassede rør kunne også oprettes ved hjælp af Angular 2.
- Navnet på røret defineres af pipenamnet.
- Den tilpassede rørklasse defineres af rørklassen.
- Til arbejde med røret bruges transformfunktionen.
- Til røret sendes parametrene af parametre.
- Rørets returtype er defineret af Returtypen.
Livscyklus for vinkel 2
Fra dens start til slutningen af applikationen har Angular 2-applikationen sin livscyklus.
Dette diagram viser hele livscyklussen i Angular 2. Nedenfor er beskrivelsen.
- Ændringen i værdien af en databundet egenskab er beskrevet ved metoden ngOnChanges.
- Når Angular viser de databundne egenskaber, kaldes ngOnInit-metoden under initialiseringen af komponenten.
- Når Angular i sig selv ikke kunne registrere ændringer, bruges ngDoCheck til detektion.
- I komponentens visning, når det eksterne indhold projiceres af vinklen, kaldes ngAfterContentInit som svar.
- Når først det indhold, der projiceres, er kontrolleret af Vinklen, kaldes ngAfterContentChecked som svar.
- Når komponentens visninger og underordnede synspunkter er initialiseret af Vinklen, kaldes ngAfterInit.
- NgAfterViewChecked kaldes efter, at komponenterne og underordnede synspunkter er kontrolleret af vinklen.
- Før ødelæggelsen af direktivet eller komponenten af vinklen ødelægger ngo'erne, som er oprydningsfasen.
Services er en anden egenskab ved Angular 2, der bruges, når forskellige moduler har brug for en fælles funktionalitet. Blandt forskellige moduler kunne databasefunktionaliteten genbruges. Databasefunktionaliteten kunne bruges af den oprettede tjeneste.
Hvorfor har vi brug for Angular 2?
- Angular 2 indeholder funktioner, der hjælper med debugging og forståelse af koden, udviklingen og redigeringsoplevelsen ville også blive forbedret.
- Kodningen bliver mere konsistent ved hjælp af Angular 2.
- Angular 2 giver omfattende bindingsfunktioner. Dets egenskabsbindende funktion gør det muligt at kontrollere DOM. Reaktion på enhver begivenhed fra udsigten kunne opnås ved hjælp af begivenhedsbinding.
- En komplet routingfunktion leveres af Angular 2.
- Angular 2 har omfattende dokumentation og support fra lokalsamfundet, der giver en løsning på næsten alle problemer, der står overfor.
Konklusion
Angular 2 er en af de mest efterspurgte rammer for webudvikling og den, du har brug for for at opbygge din næste webapplikation.
Anbefalede artikler
Dette er en guide til Hvad er Angular 2? Her diskuterer vi introduktionen, modulerne i vinkel 2, vinkel 2 funktioner sammen med livscyklen for vinkel 2. Du kan også gennemgå vores andre foreslåede artikler for at lære mere–
- Sådan installeres Angular 2?
- R Programmeringssprog
- Typer af websteder
- Typer af webhosting