Что такое $ Scope в AngularJS? Учебник с примером

Содержание:

Anonim

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

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

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

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

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

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

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

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

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

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

Guru99

Guru99 Global Event


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

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

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

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

Выход:

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

Резюме

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