AngularJS ng-bind 指令
AngularJS ng-bind 指令，AngularJS 中的ng-bind 指令用于将值与 HTML 元素绑定。每当 ng-bind 指令中表达式的值发生变化时， HTML 内容的值就会更新。
语法：
<element ng-bind="expression"> 内容... </element>其中expression 用于指定要计算的表达式或变量。
示例 1：使用 ng-bind 指令将两个数字的乘积绑定到 <span> 元素。
<!DOCTYPE html>
<html>
<head>
<title>ng-bind Directive</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js">
</script>
</head>
<body ng-app="gfg" style="text-align:center">
<h1 style="color:green">GeeksforGeeks</h1>
<h2>ng-bind Directive</h2>
<div ng-controller="app">
num1: <input type="number" ng-model="num1"
ng-change="product()" />
<br><br>
num2: <input type="number" ng-model="num2"
ng-change="product()" />
<br><br>
<b>Product:</b> <span ng-bind="result"></span>
</div>
<script>
var app = angular.module("gfg", []);
app.controller('app', ['$scope', function ($app) {
$app.num1 = 1;
$app.num2 = 1;
$app.product = function () {
$app.result = ($app.num1 * $app.num2);
}
}]);
</script>
</body>
</html>输出：
示例 2：本示例使用 ng-bind 指令将 <span> 元素的 innerHTML 绑定到变量文本。
<!DOCTYPE html>
<html>
<head>
<title>ng-bind Directive</title>
<script src=
"https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js">
</script>
</head>
<body style = "text-align:center">
<h1 style = "color:green">GeeksforGeeks
<h2 style = "">ng-bind directive</h2>
<div ng-app="" ng-init="txt='GeeksforGeeks';col='green'">
<div>
<span ng-bind="txt"></span> is the
computer science portal for geeks.
</div>
</div>
</body>
</html>输出：
常见问题FAQ
- 程序仅供学习研究，请勿用于非法用途，不得违反国家法律，否则后果自负，一切法律责任与本站无关。
- 请仔细阅读以上条款再购买，拍下即代表同意条款并遵守约定，谢谢大家支持理解！
