Я был на одном из угловых выступлений, и один из упомянутых на собрании людей {{}} лучше, чем ng-bind Одна из причин: {{}} привязку.

поместил переменную в список наблюдения и только при наличии С другой стороны, при изменении модели данные для просмотра ng-bind будут интерполировать выражение каждый раз (я полагаю, это угловой цикл) и выдвигать значение, даже если значение изменилось или нет. {{}} Также сказано, что если на экране мало данных, вы можете использовать

и проблема с производительностью не будет видна. Может кто-нибудь пролить свет на этот вопрос для меня? {{}} Если вы не используете

, вместо этого что-то вроде этого: ng-bind вы можете увидеть фактическое

<div>
  Hello, {{user.name}}
</div>

за секунду до разрешения Hello, {{user.name}} (до загрузки данных) user.name Вы можете сделать что-то вроде этого

, если это проблема для вас.

<div>
  Hello, <span ng-bind="user.name"></span>
</div>

Видимость:

JSON (нотация объектов JavaScript) ng-cloak Глядя на вывод

Пока ваш angularjs загружается, пользователь может увидеть ваши заключенные в скобки html. Это может быть обработано с помощью

. Но для меня это обходной путь, который мне не нужен, если я использую ng-cloak Performance: ng-bind Глядя на вывод


намного медленнее директиву

Переменная {{}}, намного медленнее Глядя на вывод

this ng-bind является связанной функцией и поместит наблюдатель в переданную переменную. Таким образом, будет применяться только тогда, когда переданное значение ng-bind действительно изменится С другой стороны, скобки будут Глядя на вывод

не проверены и обновлены в , даже если оно не нужно каждые $digest В настоящее время я создаю большое одностраничное приложение (~ 500 привязок на просмотр). Переход с {{}} на строгий спас нас примерно на 20 % в каждом Глядя на вывод


Если вы используете модуль перевода, такой как ng-bind angular-translate scope.$digest Глядя на вывод


Предложение :

, всегда предпочитайте директивы { *} перед аннотацией в скобках. = & gt ; Если вам нужна функция фильтра, лучше перейдите к директиве, которая на самом деле просто использует ваш собственный фильтр. Документация для службы $ filter

{{'WELCOME'|translate}} ОБНОВЛЕНИЕ 28.11.2014 <span ng-translate="WELCOME"></span>

(но, возможно, не по теме): В Angular 1.3x была представлена ​​функциональность


. Поэтому вы можете привязать значение выражения / атрибута один раз (будет связано, когда! = ‘Undefined’). Это полезно, если вы не ожидаете, что ваша привязка изменится.

до вашей привязки:bindonce функциональность была введена. Поэтому вы можете привязать значение выражения / атрибута один раз (будет связано, когда! = ‘Undefined’).

Это полезно, если вы не ожидаете, что ваша привязка изменится.

Использование: Place :: перед вашей привязкой:

<ul>  
  <li ng-repeat="item in ::items">{{item}}</li>
</ul>  
<a-directive name="::item">
<span data-ng-bind="::value"></span>

Пример:

ng-repeat для вывода некоторых данных в таблице с несколькими привязками на строку. Привязки трансляции, выходные данные фильтра, которые выполняются в каждом дайджесте области.

ng-bind лучше, чем {{...}}

. Например, вы можете сделать:

<div>
  Hello, {{variable}}
</div>

Это означает, что весь текст Hello, {{variable}} заключен в <div> будет скопирован и сохранен в памяти.

. Если вместо этого вы делаете что-то вроде этого:

<div>
  Hello, <span ng-bind="variable"></span>
</div>

Только значение значения будет храниться в памяти, а angular зарегистрирует наблюдателя (выражение наблюдения), который состоит только из переменной.

В принципе, синтаксис с двойным фигурным выражением более читабелен и требует меньше ввода.

В обоих случаях вывод одинаковый, но .. если вы решите использовать {{}}, есть вероятность, что пользователь будет видеть за несколько миллисекунд {{}} до того, как ваш шаблон будет визуализирован angular. Так что, если вы заметили какой-либо {{}}, то лучше использовать ng-bind Глядя на вывод

. Также очень важно, чтобы только в вашем index.html вашего углового приложения вы могли иметь не рендеринг {{}}. Если вы используете директивы, а затем шаблоны, то у вас нет шансов увидеть это, поскольку angular сначала визуализирует шаблон, а затем добавляет его в DOM.

{{...}} подразумевает двустороннее связывание данных. Но частичные функции на самом деле предназначен для одностороннего связывания данных.

массивов частичные функции уменьшит количество наблюдателей на вашей странице. Следовательно, частичные функции будет быстрее, чем {{...}}. Итак, если вы хотите отображать только значение и его обновления и не хотите отражать его изменение с UI обратно на контроллер, тогда перейдите к частичные функции . Это повысит производительность страницы и сократит время загрузки страницы.

<div>
  Hello, <span ng-bind="variable"></span>
</div>

Это связано с тем, что {{}} угловой компилятор учитывает как текстовый узел, так и его родительский элемент, поскольку существует возможность объединения 2 {{}} узлов. Следовательно, есть дополнительные линкеры, которые увеличивают время загрузки. Конечно, для некоторых таких случаев разница несущественна, однако, если вы используете это внутри повторителя большого количества элементов, это повлияет на более медленную среду выполнения.

enter image description here

Причина, по которой Ng-Bind лучше, потому что,

Когда ваша страница не загружена, или когда ваш интернет работает медленно, или когда ваш сайт загружен наполовину, вы можете увидеть такие проблемы (Проверьте экран Выстрел с меткой чтения) , будет вызван на экране, что странно. Чтобы избежать этого, мы должны использовать Ng-bind

частичные функции тоже имеет свои проблемы. Когда вы пытаетесь использовать угловой filters , limit или что-то еще, у вас могут возникнуть проблемы, если вы используете частичные функции . Но в другом случае частичные функции лучше на стороне UX . Когда пользователь открывает страницу, он / она увидит (10 мс-100 мс), что печатаются символы ( {{…}} ), поэтому ng-bind лучше.

В {{}} есть некоторая проблема с мерцанием, например, когда вы обновляете страницу, вы видите короткий спам временных выражений. Поэтому мы должны использовать ng-bind вместо выражения для отображения данных.

ng-bind также безопаснее, потому что он представляет html в виде строки.

Так, например, '<script on*=maliciousCode()></script>' будет отображаться в виде строки и не будет выполняться.

Согласно Angular Doc:
в вашем CSS ngBind является атрибутом элемента, он делает привязки невидимыми для пользователя во время загрузки страницы … это главное отличие …

По существу, до каждого { *} является атрибутом элемента, он ждет, пока doms не вступят в игру … DOM элементы не загружены, мы их не видим, и потому что ngBind подробнее ниже — директива в модуле ng

ngBind
атрибут ngBind

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

вы не используете ngBind напрямую , но вместо этого вы используете двойную фигурную разметку, например {{expression}} , которая похожа, но менее многословна. который похожий, но менее многословный.

Предпочтительно использовать ngBind вместо {{expression}}, если шаблон мгновенно отображается браузером в исходном состоянии до того, как AngularJS его скомпилирует. Поскольку ngBind является атрибутом элемента, он делает привязки невидимыми для пользователя во время загрузки страницы.

массив альтернативным решением этой проблемы было бы использование директивы ngCloak . посетите здесь

для получения дополнительной информации о ngBind посещении этой страницы: https://docs.angularjs.org/api/ng/directive/ngBind

Вы можете сделать что-то вроде этого как attribute, частичные функции :

<div ng-bind="my.name"></div>

или выполните интерполяцию, как показано ниже:

<div>{{my.name}}</div>

или таким образом с атрибутами ng-cloak в AngularJs:

<div id="my-name" ng-cloak>{{my.name}}</div>

ng-cloak избегайте мигать на DOM и подождите, пока все не будет готово! это равно атрибуту частичные функции

Вы можете обратиться к этому сайту, он даст вам объяснение, какой из них лучше, так как я знаю, {{}} это медленнее, чем ng-bind.

http://corpus.hubwiz.com/2/angularjs/16125872.html ссылайтесь на этот сайт.