Hvad er $ Scope i AngularJS? Tutorial med eksempel

Indholdsfortegnelse:

Anonim

Hvad er $ scope i AngularJS?

$ scope i AngularJS er et indbygget objekt, der grundlæggende binder "controller" og "view". Man kan definere medlemsvariabler i omfanget inden for controlleren, som derefter kan tilgås af visningen.

Overvej eksemplet nedenfor:

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

Kode Forklaring:

  1. Navnet på modulet er "app"
  2. Navnet på controlleren er "HelloWorldCntrl"
  3. Scope-objekt er det vigtigste objekt, der bruges til at videregive oplysninger fra controlleren til visningen.
  4. Medlemsvariabel tilføjet til scope-objektet

Opsætning eller tilføjelse af adfærd

For at reagere på begivenheder eller udføre en slags beregning / behandling i visningen, skal vi give adfærd til omfanget.

Adfærd føjes til omfangsobjekter for at svare på specifikke begivenheder, der muligvis udløses af visningen. Når opførslen er defineret i controlleren, kan den fås via visningen.

Lad os se på et eksempel på, hvordan vi kan opnå dette.

Guru99

Guru99 Global Event

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

Kode Forklaring:

  1. Vi opretter en adfærd kaldet "fullName". Denne adfærd er en funktion, der accepterer 2 parametre (fornavn, efternavn).
  2. Adfærden returnerer derefter sammenkædningen af ​​disse 2 parametre.
  3. I den opfattelse kalder vi adfærd og overfører 2 værdier af "Guru" og "99", som bliver sendt som parametre til adfærd.

Hvis kommandoen udføres med succes, vises følgende output, når du kører din kode i browseren.

Produktion:

I browseren vil du se en sammenkædning af begge værdierne af Guru & 99, der blev videregivet til opførelsen i controlleren.

Resumé

  • Forskellige medlemsvariabler kan føjes til omfangsobjektet, som derefter kan henvises til i visningen.
  • Adfærd kan tilføjes for at arbejde med begivenheder, der genereres til handlinger udført af brugeren.
  • Angularjs $rootScopeer omfanget for hele applikationen. En applikation kan kun have en $ rootScope og bruges som en global variabel. I Angular JS $ er rækkevidde underordnede rækkevidde, og $ rootScope er overordnet omfang