Що таке $Scope в AngularJS? Підручник із функціями (приклади)

Що таке $scope в AngularJS?

$scope в AngularJS це вбудований об’єкт, який в основному пов’язує «контролер» і «перегляд». Можна визначити змінні-члени в області видимості в контролері, до яких потім може бути доступний перегляд.

Розглянемо приклад нижче:

$scope в AngularJS

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

Пояснення коду:

  1. Назва модуля — «додаток»
  2. Назва контролера «HelloWorldCntrl»
  3. Об’єкт області – це основний об’єкт, який використовується для передачі інформації від контролера до представлення.
  4. Змінну члена додано до об’єкта області

Налаштування або додавання поведінки

Щоб реагувати на події або виконувати певні обчислення/обробку в представленні, ми повинні забезпечити поведінку для області.

Поведінки додаються до об’єктів області, щоб реагувати на певні події, які можуть бути викликані View. Як тільки поведінка визначена в контролері, до неї можна отримати доступ за допомогою представлення.

Давайте розглянемо приклад того, як ми можемо цього досягти.

Налаштування або додавання поведінки

<!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>

Пояснення коду:

  1. Ми створюємо поведінку під назвою «fullName». Ця поведінка є функцією, яка приймає 2 параметри (ім’я, прізвище).
  2. Потім поведінка повертає конкатенацію цих 2 параметрів.
  3. У поданні ми викликаємо поведінку та передаємо 2 значення «Guru» та «99», які передаються як параметри поведінки.

Якщо команда виконана успішно, під час запуску коду в браузері буде показано наступний результат.

вихід:

Налаштування або додавання поведінки

У браузері ви побачите конкатенацію обох значень Guru та 99, які були передані поведінці в контролер.

Підсумки

  • До об’єкта області можна додати різні змінні-члени, на які потім можна посилатися в поданні.
  • Поведінка може бути додана для роботи з подіями, які генеруються для дій, які виконує користувач.
  • Команда AngularJS $rootScope це область для всієї програми. Програма може мати лише один $rootScope і використовується як глобальна змінна. В Angular JS $scopes є дочірніми областями, а $rootScope є батьківською областю