Что такое $Scope в AngularJS? Учебник с функцией (примеры)

Что такое $scope в AngularJS?

$scope в AngularJS — это встроенный объект, который по сути связывает «контроллер» и «представление». Можно определить переменные-члены в области действия внутри контроллера, к которым затем может получить доступ представление.

Рассмотрим пример ниже:

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

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

Имя модуля — «приложение».
Имя контроллера — «HelloWorldCntrl».
Объект Scope — это основной объект, который используется для передачи информации от контроллера к представлению.
Переменная-член добавлена в объект области

Настройка или добавление поведения

Чтобы реагировать на события или выполнять какие-либо вычисления/обработки в представлении, мы должны обеспечить поведение области видимости.

Поведения добавляются к объектам области действия для реагирования на определенные события, которые могут быть вызваны представлением. Как только поведение определено в контроллере, представление может получить к нему доступ.

Давайте посмотрим на примере, как мы можем этого добиться.

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

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

Мы создаем поведение под названием «fullName». Это поведение представляет собой функцию, которая принимает 2 параметра (имя, фамилия).
Затем поведение возвращает объединение этих двух параметров.
В представлении мы вызываем поведение и передаем два значения «Гуру» и «2», которые передаются в качестве параметров поведения.

Если команда выполнена успешно, при запуске кода в браузере будет отображен следующий вывод.

Вывод:

В браузере вы увидите объединение значений Guru и 99, которые были переданы поведению в контроллер.

Резюме

К объекту области можно добавлять различные переменные-члены, на которые затем можно ссылаться в представлении.
Поведение может быть добавлено для работы с событиями, которые генерируются для действий, выполняемых пользователем.
The AngularJS $rootScope это область действия всего приложения. Приложение может иметь только один $rootScope и используется как глобальная переменная. В Angular JS $scopes — это дочерние области, а $rootScope — родительская область.