Angularjs ng bind和ng模板之间的功能区别是什么?
考虑以下代码-它使用ng bind在元素级别定义的表达式中打印这两个模型Angularjs ng bind和ng模板之间的功能区别是什么?,angularjs,Angularjs,考虑以下代码-它使用ng bind在元素级别定义的表达式中打印这两个模型 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Example - example-example16-production</title> <script src="//ajax.googleapis.com/ajax/libs/angu
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-example16-production</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.10/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.10/angular-sanitize.js"></script>
<script src="script.js"></script>
</head>
<body ng-app="ngBindHtmlExample">
<div ng-controller="ngBindHtmlCtrl">
<input type="text" ng-model='asd'/>
<input type="text" ng-model='asdasd'/><br>
<span ng-bind='asd +" "+ asdasd'> </span>
<p ng-bind-html="myHTML"></p>
</div>
</body>
</html>
示例-示例-示例16-生产
现在考虑这个NG模板的代码,它完全相同,但是只在表达式
中使用{{}}。<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-example15-production</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.10/angular.min.js"></script>
</head>
<body ng-app="">
<script>
function Ctrl($scope) {
$scope.salutation = 'Hello';
$scope.name = 'World';
}
</script>
<div ng-controller="Ctrl">
Salutation: <input type="text" ng-model="salutation"><br>
Name: <input type="text" ng-model="name"><br>
<pre ng-bind-template="{{salutation}} {{name}}!"></pre>
</div>
</body>
</html>
示例-示例-示例15-生产
函数Ctrl($scope){
$scope.saltation='Hello';
$scope.name='World';
}
称呼:
名称:
这两个指令和最佳实践的主要目的是什么?这两个指令和最佳实践之间的区别已经被清楚地讨论过了
简而言之,不能使用ng bind将多个值绑定到单个html元素。但您可以使用ng绑定模板来实现这一点。当然,您可以像在问题中所做的那样,使ng bind像ng bind模板一样工作。主要区别在于执行多个表达式。此外,ng bind速度更快,而且由于很少需要使用多个表达式,因此使用ng bind更可取。查看此问题:@KayakDave感谢您的建议,但问题与上述不同,因为它关注ng模板和ng bind之间的功能差异