Spec-Zone.ru › Angular.js 1.7

Улучшить эту документацию Просмотреть исходный код ngController

  1. директива в модуле ng

Обзор

Директива ngController прикрепляет класс контроллера к представлению. Это ключевой аспект того, как Angular поддерживает принципы шаблона проектирования MVC.

Компоненты MVC в Angular:

  • Модель — Модели являются свойствами области видимости; области видимости прикрепляются к DOM, где свойства области видимости доступны через привязки.
  • Представление — Шаблон (HTML с привязками данных), который отображается в Представлении.
  • Контроллер — Директива ngController указывает класс Контроллера; класс содержит бизнес-логику приложения для украшения области видимости функциями и значениями

Обратите внимание, что вы также можете прикрепить контроллеры к DOM, объявив их в определении маршрута через сервис $route. Распространённой ошибкой является повторное объявление контроллера с использованием ng-controller в самом шаблоне. Это приведёт к тому, что контроллер будет прикреплён и выполнен дважды.

Информация о директиве

  • Эта директива создаёт новую область видимости.
  • Эта директива выполняется на уровне приоритета 500.

Использование

  • в качестве элемента:
    <ng-controller
      ng-controller="expression">
    ...
    </ng-controller>
  • в качестве атрибута:
    <ANY
      ng-controller="expression">
    ...
    </ANY>

Аргументы

Параметр Тип Подробности
ngController expression

Имя конструкторской функции, зарегистрированной в текущем $controllerProvider или выражение, которое в текущей области видимости вычисляется в конструкторскую функцию.

Экземпляр контроллера может быть опубликован в свойство области видимости, указав ng-controller="as propertyName".

Пример

Вот простая форма для редактирования контактной информации пользователя. Добавление, удаление, очистка и приветствие — это методы, объявленные в контроллере (см. вкладку исходного кода). Эти методы легко вызываются из разметки AngularJS. Любые изменения данных автоматически отражаются в Представлении без необходимости ручного обновления.

Ниже представлены два разных стиля объявления:

  • один связывает методы и свойства непосредственно с контроллером, используя this: ng-controller="SettingsController1 as settings"
  • один вводит $scope в контроллер: ng-controller="SettingsController2"

Второй вариант более распространён в сообществе AngularJS и обычно используется в шаблонах и в этом руководстве. Однако есть преимущества привязки свойств непосредственно к контроллеру и избегания области видимости.

  • Использование controller as делает очевидным, к какому контроллеру вы обращаетесь в шаблоне, когда к элементу применяются несколько контроллеров.
  • Если вы пишете свои контроллеры в виде классов, у вас проще доступ к свойствам и методам, которые появятся в области видимости, изнутри кода контроллера.
  • Поскольку в привязках всегда есть ., вам не нужно беспокоиться о том, как прототипное наследование маскирует примитивы.

Этот пример демонстрирует синтаксис controller as.

Этот пример демонстрирует стиль прикрепления контроллера к $scope.

© 2010–2018 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://code.angularjs.org/1.7.8/docs/api/ng/directive/ngController

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API