Hvad er $Scope i AngularJS? Selvstudie med funktion (eksempler)

Hvad er $scope i AngularJS?

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

Overvej eksemplet nedenfor:

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

Kodeforklaring:

Navnet på modulet er "app"
Navnet på controlleren er "HelloWorldCntrl"
Scope-objekt er hovedobjektet, som bruges til at videregive information fra controlleren til visningen.
Medlemsvariabel tilføjet til scope-objekt

Opsætning eller tilføjelse af adfærd

For at reagere på hændelser eller udføre en form for beregning/behandling i visningen, skal vi angive adfærd til scopet.

Adfærd føjes til scope-objekter for at reagere på specifikke hændelser, der kan udløses af visningen. Når adfærden er defineret i controlleren, kan den tilgås af visningen.

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

<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta chrset="UTF 8">
    <title>Guru99</title>     
</head>  
<body ng-app="DemoApp">
<h1> Guru99 Global Event</h1>
<script src="https://code.angularjs.org/1.6.9/angular.js"></script>
<div ng-controller="DemoController">
	{{fullName("Guru","99")}}
</div>
<script type="text/javascript">  
	var app = angular.module("DemoApp", []);
	app.controller("DemoController", function($scope) {
    
    $scope.fullName=function(firstName,lastname){
		return firstName + lastname;
		}
	} );
</script> 

</body>  
</html>

Kodeforklaring:

Vi opretter en adfærd kaldet "fuldt navn". Denne adfærd er en funktion, som accepterer 2 parametre (fornavn, efternavn).
Funktionen returnerer derefter sammenkædningen af disse 2 parametre.
I visningen kalder vi adfærden og overfører 2 værdier af "Guru" og "99", som overføres som parametre til adfærden.

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

Output:

I browseren vil du se en sammenkædning af både værdierne for Guru og 99, som blev overført til adfærden i controller.

Resumé

Forskellige medlemsvariabler kan tilføjes til scope-objektet, som derefter kan refereres til i visningen.
Adfærd kan tilføjes til at arbejde med hændelser, som er genereret til handlinger udført af brugeren.
AngularJS $rootScope er omfanget for hele ansøgningen. En applikation kan kun have én $rootScope og bruges som en global variabel. I Angular JS er $scopes underordnede omfang, og $rootScope er overordnet omfang

Du kan lide: