Улучшить эту документациюВыражения Angular

Выражения Angular — это фрагменты кода, похожие на JavaScript, которые обычно помещаются в привязки, такие как {{ expression }}.

Например, следующие выражения допустимы в Angular:

• 1+2
• a+b
• user.name
• items[index]

Выражения Angular по сравнению с выражениями JavaScript

Выражения Angular похожи на выражения JavaScript с следующими отличиями:

• Контекст: Выражения JavaScript вычисляются относительно глобального window. В Angular выражения вычисляются относительно объекта scope.

• Устойчивость к ошибкам: В JavaScript попытка оценить неопределённые свойства приводит к ReferenceError или TypeError. В Angular оценка выражений устойчива к undefined и null.

• Отсутствие операторов управления потоком: В выражении Angular нельзя использовать следующие операторы: условные операторы, циклы или операторы исключений.

• Отсутствие объявления функций: В выражении Angular нельзя объявлять функции, даже внутри директивы ng-init.

• Отсутствие создания регулярных выражений с помощью литеральной записи: В выражении Angular нельзя создавать регулярные выражения.

• Отсутствие операторов запятой и void: В выражении Angular нельзя использовать , или void.

• Фильтры: В выражениях можно использовать фильтры, чтобы отформатировать данные перед их отображением.

Если вам нужно выполнить более сложный код JavaScript, сделайте его методом контроллера и вызовите метод из представления. Если вы хотите eval() выражение Angular самостоятельно, используйте метод $eval().

Вы можете попробовать оценить различные выражения здесь:

Контекст

Angular не использует глобальную область видимости JavaScript для оценки выражений. Вместо этого служба $parse обрабатывает эти выражения.

Выражения Angular не имеют доступа к глобальным переменным, таким как window, document или location. Это ограничение является намеренным. Оно предотвращает случайный доступ к глобальному состоянию — распространённой причине появления скрытых ошибок.

Вместо этого используйте такие службы, как $window и $location в функциях, вызываемых из выражений. Такие службы обеспечивают доступ к глобальным переменным, который можно смоделировать.

Устойчивость к ошибкам

Оценка выражений устойчива к значениям undefined и null. В JavaScript оценка a.b.c вызывает исключение, если a не является объектом. Хотя это имеет смысл для языка общего назначения, оценка выражений в основном используется для привязки данных, которая часто выглядит так:

{{a.b.c}}

Более разумно отображать ничего, чем вызывать исключение, если a не определено (возможно, мы ожидаем ответа от сервера, и оно скоро будет определено). Если оценка выражения не была устойчивой к ошибкам, нам пришлось бы писать привязки, которые усложняли бы код, например: {{((a||{}).b||{}).c}}

Аналогично, вызов функции a.b.c() на undefined или null просто возвращает undefined.

Отсутствие операторов управления потоком

Помимо условного оператора (a ? b : c), в выражении нельзя использовать операторы управления потоком. Причина этого в основе философии Angular, согласно которой логика приложения должна находиться в контроллерах, а не в представлениях. Если вам нужен реальный условный оператор, цикл или оператор исключения из выражения представления, делегируйте их в метод JavaScript.

Отсутствие объявлений функций или создания регулярных выражений с помощью литеральной записи

В выражениях Angular нельзя объявлять функции или создавать регулярные выражения. Это делается для предотвращения сложной логики преобразования моделей внутри шаблонов. Такую логику лучше поместить в контроллер или в специальный фильтр, где её можно надлежащим образом протестировать.

$event

Директивы, такие как ngClick и ngFocus, раскрывают объект $event в рамках области видимости этого выражения. Объект является экземпляром объекта события jQuery, если jQuery присутствует, или аналогичным объектом jqLite.

Обратите внимание в примере выше, как мы можем передать $event в clickMe, но как он не отображается в {{$event}}. Это происходит потому, что $event находится вне области видимости этой привязки.

Привязка один раз

Выражение, начинающееся с ::, считается выражением однократной привязки. Выражения однократной привязки перестанут пересчитываться, когда они стабилизируются, что происходит после первого прохода, если результат выражения — не undefined (см. алгоритм стабилизации значения ниже).

Зачем эта функция

Основная цель выражения однократной привязки — предоставить способ создания привязки, которая отписывается и высвобождает ресурсы, когда привязка стабилизируется. Сокращение количества отслеживаемых выражений ускоряет цикл переваривания и позволяет отображать больше информации одновременно.

Алгоритм стабилизации значения

Выражения однократной привязки сохранят значение выражения в конце цикла переваривания, пока это значение не будет undefined. Если значение выражения устанавливается в цикле переваривания, а затем в том же цикле переваривания устанавливается в undefined, то выражение не выполняется и продолжит отслеживание.

1. Для выражения, начинающегося с ::, при входе в цикл переваривания и проверке выражения на изменение, значение хранится как V
2. Если V не равно undefined, результат выражения отмечается как стабильный, и планируется задача для отмены отслеживания этого выражения при выходе из цикла переваривания
3. Обработка цикла переваривания продолжается в обычном режиме
4. Когда цикл переваривания завершён и все значения стабилизировались, выполняются задачи по отмене отслеживания. Для каждой задачи отмены отслеживания проверяется, сохраняет ли оно значение, отличное от undefined. В этом случае отслеживание отменяется. В противном случае выражение продолжит проверку на изменения в будущих циклах переваривания, следуя тому же алгоритму, начиная с шага 1

Особый случай для объектных литералов

В отличие от простых значений, литералы объектов отслеживаются до тех пор, пока каждый ключ не будет определён. См. http://www.bennadel.com/blog/2760-one-time-data-bindings-for-object-literal-expressions-in-angularjs-1-3.htm

Как использовать привязку один раз

Если выражение не изменится после установки, оно является кандидатом для однократной привязки. Вот три примера случаев.

При интерполяции текста или атрибутов:

<div name="attr: {{::color}}">text: {{::name}}</div>

При использовании директивы с двунаправленной привязкой и параметрах, которые не изменятся:

someModule.directive('someDirective', function() {
  return {
    scope: {
      name: '=',
      color: '@'
    },
    template: '{{name}}: {{color}}'
  };
});

<div some-directive name="::myName" color="My color is {{::myColor}}"></div>

При использовании директивы, принимающей выражение:

<ul>
  <li ng-repeat="item in ::items">{{item.name}};</li>
</ul>