Hvad er isoleret omfang i Angular8?

Hvis du har brugt i nogen tid nu har du sandsynligvis hørt om omfangsfunktionen. Det er et indbygget modul i Angular8 og har sin oprindelse fra Parent Scope-standard. Men for det meste kræves det ikke i udviklingen af ​​fælles komponenter, og sådan kom isoleret omfang ind i billedet. I denne artikel vil vi diskutere alt om det isolerede omfang i Angular8 i følgende rækkefølge:

• Hvad er isoleret omfang i Angular8?
• Eksempler
• Foreach-funktion i Angular8

Lad os begynde.

Hvad er isoleret omfang i Angular8?

Isoleret omfang i Angular8 er ikke afledt prototypisk fra overordnet omfang, men det gør funktionen for at få adgang til det overordnede omfang gennem $ forælder. Det isolerede anvendelsesområde-direktiv i Python har tre grundlæggende egenskaber, som er anført nedenfor.

1. scope: false: Dette direktiv bruges som standard i isoleret omfang, og det bruges hovedsageligt til at genbruge omfanget fra den komponent, det i øjeblikket bruges til.

2. omfang: sandt: Dette direktiv bruges til at skabe et børns omfang, og det arver prototypisk det overordnede omfang.

3. anvendelsesområde: {…}: Dette bruges til at skabe det isolerede omfang, og dette er prototypisk fra det overordnede omfang.

   
   
   

For at forstå ovenstående direktiver bedre, se nærmere på forklaringerne nedenfor.

rækkevidde: sandt

hvordan man tager skærmbillede i selen

Forældres anvendelsesområde<<======prototype====== Child Scope

<<====== $Parent ====== Child Scope

anvendelsesområde: {}

Forældres anvendelsesområde<<=====$Parent Scope ========= Isolates Scope

Her skal vi bruge tre typer grænseflader mellem det isolerede omfang og det overordnede omfang.

1. data bind (=)

2. interpolere (@)

3. udtryk (&)

Eksempler

scope: {myValue1: '@ attribute1', myValue2: '= attribute2', myValue3: '& attribute3'}

Interpolere eller attributter (@)

Dette bruges til at binde det isolerede omfang med DOM-attributten. Dette opsætter grundlæggende et envejsdirektiv, der skal bruges mellem det isolerede omfang og det overordnede omfang. Hvad dette betyder er, at hvis der er ændringer i forældrenes omfang, vil det samme øjeblikkeligt også blive afspejlet i det isolerede omfang.

Eksempel

.directive ('myDirective', funktion () {return {scope: {myAttribute: '@',}}})

Nu kan vi bruge et direktiv til at binde disse to sammen.

Udtryk (&)

Udtrykket (&) bruges til at kalde en funktion fra det overordnede omfang til det isolerede omfang. Det bruges hovedsageligt til at oprette tilbagekald blandt andre funktioner.

Eksempel

.directive ('myDirective', funktion () {return {scope: {myIsolatedFunction: '&'}}})

Nu skal vi bruge DOM

Klik på OK Metoden kalder nu tilbage til controlleren på følgende måde. .controller ('myTestController', ['$ scope', funktion ($ scope) {$ scope.myUpdatedValue = funktion (myValue) {$ scope.updatedValue = myValue}}])

Bindende (=)

Binding (=) svarer til attributter, den eneste forskel er, at den skaber en tovejskommunikationskanal i stedet for en.

Eksempel

indstilling af Java klassesti i Linux

.directive ('myDirective', funktion () {return {scope: {myBinding: '=',}}})

Foreach-funktion i Angular8

Nu hvor du kender det grundlæggende koncept for det isolerede omfang i Angular8, så lad os også udforske foreach-funktionen.

Foreach i Angular8

For at aktivere foreach-funktionen i Angular8 skal du følge nedenstående trin.

Trin 1

Start Visual Editor 2012, og naviger til Project under Ny og fil. Når vinduet åbnes, navngiv filen som forOrforeach, og klik derefter på OK-knappen.

fordele og ulemper ved python

Trin 2

Når trin 1 er afsluttet, skal du åbne Solution Explorer, som indeholder css-fil, js-fil, ts-fil såvel som html-fil.

Trin # 3

Kør nu følgende kode til foreach-funktionen.

forOrforeach.ts

klasse A {funktion () {var array = [1, 2, 3, 4] for (var v i array) // for fungerer som et foreach {alarm (array [v])}}} window.onload = () => {var call = new A () call.function ()}

Standard.html

TypeScript HTML-app

App.js

var A = (funktion () {funktion A () {} A. prototype.function = funktion () {var array = [1, 2, 3, 4] for (var v i array) {alarm (array [v] )}} returner A}) () window.onload = funktion () {var call = new A () call.function ()}

Outputtet til ovenstående koder vil se sådan ud.

forEach i TypeScript

Lad os nu undersøge, hvordan vi implementerer en foreach-erklæring i TypeScript.

Newforeach.ts

klasse A {nr: nummer [] = [1, 2, 3] lognummer () {this.nr.forEach ((nos) => {// foreach statement document.write ('number =:' + nos)}) }} window.onload = () => {var call = new A () call.lognumber ()}

Output af ovenstående vil være,

Nu hvor du ved, hvordan du bruger både foreach såvel som de isolerede scope-moduler, håber vi, at du vil bruge det samme i din daglige Angular8-kodning for at gøre det mere effektivt.Lær det grundlæggende såvel som anvendelsen af ​​både foreach samt isoleret omfang i Angular8.

Dette bringer os til slutningen af ​​Angular Tutorial-blog. Jeg håber, at denne blog var informativ og merværdi for dig. Nu skal du være klar med byggestenene i Angular og klar til at oprette en Angular-applikation. Jeg vil anbefale dig at gennemgå dette Vinkelvejledning Edureka video afspilningsliste at se videoer og lære at oprette en kantet applikation.

Tjek den af Edureka, et pålideligt online læringsfirma med et netværk på mere end 250.000 tilfredse elever spredt over hele kloden. Angular er en JavaScript-ramme, der bruges til at oprette skalerbare, virksomheds- og performance-klientesides webapplikationer. Da vedtagelsen af ​​kantede rammer er høj, er effektivitetsstyring af applikationen samfundsdrevet indirekte, hvilket giver bedre jobmuligheder. Angular Certification Training sigter mod at dække alle disse nye koncepter omkring Enterprise Application Development.