Разница между ngBind, ngBindHtm и ngBindTemplate в Angular JS

Question

Я новичок в Angular JS,

Любой из вас, ребята, может объяснить мне разницу между ngBind,ngBindHtm & ngBindTemplate в Angular JS с примером?

Answer 1

нг-связывание

ngBind используется для замены текстового содержимого указанного HTML-элемента значением данного выражения. Например, если у вас есть HTML следующим образом <b ng-bind="name"></b> и в вашем контроллере дать значение для имени как $scope.name = "John", Это приведет к <b>John</b>, Но вы не можете использовать несколько значений для привязки в одном элементе HTML. Например

$scope.first_name = "John";
$scope.second_name = "D";
<b ng-bind="first_name second_name"></b> 

Это не даст результат как <b>John D</b> привязывать только имя Таким образом, для привязки нескольких значений мы можем использовать ng-bind-template

нг-связывания-шаблон

 $scope.first_name = "John";
 $scope.second_name = "D";

<b ng-bind-template="{{first_name second_name}}"></b>

Это приводит к <b>John D</b> Но вы не можете визуализировать HTML-тег в этом обоих. Для рендеринга HTML-шаблона мы можем использовать ng-bind-html.

нг-связывания-HTML

$scope.name = "<b>John</b>";
<div ng-bind-html="name"></div>

Это приведет к Джону вместо показа <b>John</b>, Это означает, что он отображает HTML вместо отображения тега HTML.

Нажмите на эту ссылку, чтобы посмотреть пример

Answer 2

ngBind:

Атрибут ngBind указывает Angular заменять текстовое содержимое указанного элемента HTML значением данного выражения и обновлять текстовое содержимое при изменении значения этого выражения.

ngBindTemplate:

Директива ngBindTemplate указывает, что текстовое содержимое элемента должно быть заменено интерполяцией шаблона в атрибуте ngBindTemplate. В отличие от ngBind, ngBindTemplate может содержать несколько выражений {{ }}. Эта директива необходима, поскольку некоторые элементы HTML (такие как TITLE и OPTION) не могут содержать элементы SPAN. ngBindTemplate запускает только "строки"

Простая метафора для разницы:

ngBind запускает только "объекты".

ngBindTemplate запускает только "строки"