23

我是新手Angular JS

你们中的任何人都可以用一个例子解释一下ngBind, ngBindHtm& ngBindTemplatein之间的区别吗?Angular JS

4

2 回答 2

48

ng-绑定

ngBind 用于将指定 HTML 元素的文本内容替换为给定表达式的值。例如,如果你有一个如下的 html<b ng-bind="name"></b>并且在你的控制器中为 name 赋值为$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

ng-绑定模板

 $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。

ng-绑定-html

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

这将导致John而不是显示<b>John</b>. 这意味着它呈现 html 而不是显示 html 标签。

点击此链接查看示例

于 2014-01-13T08:28:06.687 回答
3

绑定:

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

ngBindTemplate:

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

区别的一个简单比喻:

ngBind只运行“对象”。

ngBindTemplate只运行“字符串”

于 2014-01-13T05:13:51.240 回答