效果是一样的,不同的是:如果网页没有被正常地渲染,那么表达式将原型显示出来,用户将看到代码显示在网页上,而即使网页发生错误,无法正常渲染数据,ng-bind将不会将代码显示在网页上。
如下代码,如果我们将angular.min.js文件注释掉,网页将无法识别是否是angular语法,那么我们看看表达式{{}} 和ng-bind将会如何显示
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<!-- <script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script> -->
</head>
<body>
<div ng-app="" ng-init="person={fName:'John',lName:'Doe'}">
<p>{{person.fName}}</p>
<p ng-bind="person.fName"></p>
</div>
</body>
</html>
如下图:
可以看到表达式{{}}被直接显示在页面上,这对用户来说不是一个很好的体验。而ng-bind则避免了这种问题。