ngBind，ngBindHtm＆amp; Angular JS中的ngBindTemplate

Question

我是Angular JS的新手。

你们中的任何一个人都能解释一下ngBind，ngBindHtm＆amp; 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> 仅绑定first_name 。因此，对于绑定多个值，我们可以使用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>

这将导致 John ，而不是显示<b>John</b>。这意味着它渲染html而不是显示html标记。

点击此链接可查看example

Answer 2

ngBind：

ngBind属性告诉Angular将指定HTML元素的文本内容替换为给定表达式的值，并在该表达式的值更改时更新文本内容。

ngBindTemplate：

ngBindTemplate指令指定元素文本内容应替换为ngBindTemplate属性中模板的插值。与ngBind不同，ngBindTemplate可以包含多个{{}}表达式。由于某些HTML元素（例如TITLE和OPTION）不能包含SPAN元素，因此需要此指令。 ngBindTemplate只运行“字符串”

区别的一个简单比喻：

ngBind 仅运行“对象”。

ngBindTemplate 仅运行“字符串”