Question

我的HTML结构中有两个代码。

首先是：

<!DOCTYPE html>
<html lang="en">
<head>
<script src="angular.min.js"></script>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <div ng-app>
  <p>Name: <input type="text" ng-model="name"></p>
  <p>{{name}}</p>
</div>
</body>
</html>

另一个是：

<!DOCTYPE html>
<html lang="en">
<head>
<script src="angular.min.js"></script>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <div ng-app>
  <p>Name: <input type="text" ng-model="name"></p>
  <p ng-bind="name"></p>
</div>
</body>
</html>

两者都给出了相同的输出，差异在哪里？

Answer 1

使用时

getSinglePrice()

在加载angularjs时，您可能会在页面上看到括号。您可以使用ng-cloak来避免用户看到{{name}}。

最好使用

<p>{{name}}</p>

因为这样可以解决问题。只有当值发生变化时，ng-bind才会显示该值。您可以检查的差异有很多解释

AngularJS : Why ng-bind is better than {{}} in angular?

Difference between ng-bind and interpolation {{}} in Angular

Answer 2

这两者之间的相似性是


用于单向绑定。

它们用于绑定视图上的数据变量。

插值指令

这里面使用{{}}你可以有一个带有范围变量的表达式，这些变量放在相应的范围内。

<强>纳克绑定

有时角度显示{{}}在渲染未编译的角度内容的页面时，ng-bind确实避免了这种情况。通过使用它，您需要使用ng-cloak指令添加。

两个角度js绑定之间的区别？

2 个答案: