Ce este $ Scope în AngularJS? Tutorial cu Exemplu

Cuprins:

Anonim

Ce este $ scope în AngularJS?

$ scope în AngularJS este un obiect încorporat care leagă practic „controlerul” și „vizualizarea”. Se pot defini variabile membre în domeniul de aplicare al controlerului, care poate fi apoi accesat de vizualizare.

Luați în considerare exemplul de mai jos:

angular.module('app',[]).controller('HelloWorldCntrl'function($scope){$scope.message = "Hello World"});

Explicatie cod:

  1. Numele modulului este „app”
  2. Numele controlerului este „HelloWorldCntrl”
  3. Obiectul Scope este obiectul principal care este utilizat pentru a transmite informații de la controler la vizualizare.
  4. Variabilă membru adăugată la obiectul scop

Configurarea sau adăugarea Comportamentului

Pentru a reacționa la evenimente sau a executa un fel de calcul / procesare în Vizualizare, trebuie să oferim comportament domeniului.

Comportamentele sunt adăugate obiectelor de scop pentru a răspunde la evenimente specifice care pot fi declanșate de Vizualizare. Odată ce comportamentul este definit în controler, acesta poate fi accesat de vizualizare.

Să vedem un exemplu al modului în care putem realiza acest lucru.

Guru99

Guru99 Global Event

{{fullName("Guru","99")}}

Explicatie cod:

  1. Creăm un comportament numit „fullName”. Acest comportament este o funcție care acceptă 2 parametri (prenume, prenume).
  2. Comportamentul returnează apoi concatenarea acestor 2 parametri.
  3. În vizualizare, numim comportamentul și trecem în 2 valori „Guru” și „99” care sunt transmise ca parametri comportamentului.

Dacă comanda este executată cu succes, următoarea ieșire va fi afișată când rulați codul în browser.

Ieșire:

În browser veți vedea o concatenare a valorilor Guru & 99 care au fost transmise comportamentului în controler.

rezumat

  • Diverse variabile membre pot fi adăugate la obiectul scop care poate fi apoi menționat în vizualizare.
  • Comportamentul poate fi adăugat pentru a lucra cu evenimente care sunt generate pentru acțiunile efectuate de utilizator.
  • Angularjs $rootScopeeste domeniul de aplicare pentru întreaga aplicație. O aplicație poate avea doar un $ rootScope și este utilizată ca o variabilă globală. În Angular JS $ scopurile sunt sfere copil și $ rootScope este sfera părinte