Jos olet käyttänyt jo jonkin aikaa olet todennäköisesti kuullut laajuusominaisuudesta. Se on sisäänrakennettu moduuli Angular8: ssa ja se on peräisin Parent Scope -oletusarvosta. Mutta suurimmaksi osaksi sitä ei vaadita yhteisten komponenttien kehittämisessä, ja näin kuvaan tuli eristetty laajuus. Tässä artikkelissa keskustelemme kaikesta Angular8: n eristetystä laajuudesta seuraavassa järjestyksessä:
Aloitetaanpa.
Mikä on eristetty laajuus Angular8: ssa?
Eristettyä laajuutta Angular8: ssa ei ole johdettu prototyyppisesti vanhemman laajuudesta, mutta se tekee ominaisuuden päästäksesi ylätason laajuuteen $ parent kautta. Pythonin eristetyllä laajuusdirektiivillä on kolme perusominaisuutta, jotka on lueteltu alla.
soveltamisala: väärä: Tätä direktiiviä käytetään oletusarvoisesti erillisessä soveltamisalassa, ja sitä käytetään pääasiassa soveltamisalan uudelleenkäyttöön komponentista, jolla sitä tällä hetkellä käytetään.
soveltamisala: totta: Tätä direktiiviä käytetään lasten ulottuvuuden luomiseen, ja se perii prototyyppisesti vanhemman soveltamisalan.
laajuus: {…}: Tätä käytetään eristetyn laajuuden luomiseen, ja tämä on prototyyppisesti vanhemman laajuuden mukainen.
Katso alla olevat selitykset ymmärtääksesi yllä olevat direktiivit paremmin.
soveltamisala: totta
Vanhempien soveltamisala<<======prototype====== Child Scope
java kaksinkertainen int pyöreään
<<====== $Parent ====== Child Scope
laajuus: {}
Vanhempien soveltamisala<<=====$Parent Scope ========= Isolates Scope
Tässä meidän on käytettävä kolmen tyyppisiä rajapintoja eristetyn laajuuden ja ylätason välillä.
- datan sidonta (=)
interpoloi (@)
ilmaisu (&)
Esimerkkejä
laajuus: {myValue1: '@ attribute1', myValue2: '= attribute2', myValue3: '& attribute3'}
Interpoloi tai määritteet (@)
Tätä käytetään eristetyn laajuuden sitomiseen DOM-määritteeseen. Tämä asettaa periaatteessa yksisuuntaisen direktiivin, jota voidaan käyttää eristetyn ja emoalueen välillä. Tämä tarkoittaa sitä, että jos vanhempien laajuudessa tapahtuu muutoksia, sama heijastuu välittömästi myös eristetyssä laajuudessa.
Esimerkki
.directive ('myDirective', function () {return {kattavuus: {myAttribute: '@',}}})
Nyt voimme käyttää direktiiviä näiden kahden sitomiseksi.
Ilmaisu (&)
Lauseketta (&) käytetään funktion kutsumiseen ylätasosta erilliseen laajuuteen. Sitä käytetään pääasiassa soittopyyntöjen luomiseen muiden toimintojen joukossa.
Esimerkki
.directive ('myDirective', function () {return {kattavuus: {myIsolatedFunction: '&'}}})
Nyt käytämme TUOMIO
Napsauta OK. Menetelmä soittaa nyt ohjaimelle seuraavalla tavalla. .controller ('myTestController', ['$ scope', function ($ scope) {$ scope.myUpdatedValue = function (myValue) {$ scope.updatedValue = myValue}}])
Sitova (=)
Sitominen (=) on samanlainen kuin määritteet, ainoa ero on, että se luo kaksisuuntaisen viestintäkanavan yhden sijasta.
Esimerkki
.directive ('myDirective', function () {return {kattavuus: {myBinding: '=',}}})
Foreach-toiminto kulmassa 8
Nyt kun tiedät Angular8: n eristetyn laajuuden peruskäsitteen, tutkitaan myös foreach-toimintoa.
Foreach kulmassa 8
Ota foreach-toiminto käyttöön Angular8: ssa seuraavasti:
Vaihe 1
Käynnistä Visual Editor 2012 ja siirry kohtaan Uusi ja tiedosto. Kun ikkuna avautuu, nimeä tiedosto nimelläOrforeach ja napsauta sitten OK-painiketta.
Vaihe # 2
Kun vaihe 1 on valmis, avaa Solution Explorer, joka sisältää css-tiedoston, js-tiedoston, ts-tiedoston sekä html-tiedoston.
Vaihe # 3
Suorita nyt seuraava koodi foreach-toiminnolle.
forOrforeach.ts
luokka A {function () {var array = [1, 2, 3, 4] for (var v in array) // for toimii foreach {alert (array [v])}}} ikkuna.onload = () => {var call = uusi A () call.function ()}
Default.html
TypeScript HTML -sovellus
App.js
var A = (funktio () {funktio A () {} A. prototyyppi.funktio = funktio () {var matriisi = [1, 2, 3, 4] kohteelle (var v ryhmässä) {hälytys (taulukko [v] )}} return A}) () window.onload = function () {var call = uusi A () call.function ()}
Yllä olevien koodien lähtö näyttää tältä.
forEach TypeScriptissä
Nyt tutkitaan, miten foreach-käsky toteutetaan TypeScriptissä.
Newforeach.ts
luokka A {no: numero [] = [1, 2, 3] lokinumero () {tämä.no.forEach ((nos) => {// foreach-käsky document.write ('number =:' + nos)}) }} window.onload = () => {var call = uusi A () call.lognumber ()}
Yllä olevan tuotos on
Nyt kun osaat käyttää sekä foreachia että eristettyjä moduuleja, toivomme, että käytät samaa päivittäisessä Angular8-koodauksessasi tehostaaksesi sitä.Opi sekä foreachin että eristetyn laajuuden perusteet ja käyttö Angular8: ssa.
Tämä vie meidät Angular Tutorial -blogin loppuun. Toivon, että tämä blogi oli informatiivinen ja lisäarvoa sinulle. Nyt sinun on oltava selvillä Angularin rakennusosista ja oltava valmis luomaan Angular-sovellus. Suosittelen sinua käymään läpi tämä Kulmaopastus Edureka-videoiden soittolista katsella videoita ja oppia luomaan kulmasovellus.
Katso Edureka, luotettava verkko-oppimisyritys, jolla on yli 250 000 tyytyväisen oppijan verkosto, joka levisi ympäri maailmaa. Angular on JavaScript-kehys, jota käytetään skaalautuvien, yritys- ja suorituskykyisten asiakaspuolen verkkosovellusten luomiseen. Kun kulmakehyksen käyttöönotto on korkea, sovelluksen suorituskyvyn hallinta on yhteisölähtöistä ja välillisesti parempia työmahdollisuuksia. Angular Certification -koulutuksen tarkoituksena on kattaa kaikki nämä uudet konseptit yrityssovellusten kehittämisen ympärillä.