下面是详细的“AngularJs expression详解及简单示例”的攻略。
什么是AngularJS表达式
AngularJS表达式是一个AngularJS模板内的小片段，用于绑定到AngularJS编译器$compile的作用域属性。表达式以{{ expression }}的形式出现在双括号中，它们绑定到当前作用域上的JavaScript变量。通俗点说，AngularJS表达式是一段AngularJS代码，可以在HTML模板中的指定位置内运行。
AngularJS表达式的使用方法
{{expression}}:此表达式会将expression的值插入到模板中。
ng-bind: 此指令使用表达式 ng-bind="expression" 来将表达式的值绑定到HTML元素。
ng-model: 此指令与表单输入元素一起使用，从而绑定这个表单控件的值到作用域中的变量。
AngularJS表达式的特点
AngularJS表达式主要有以下特点：
-
一次性的（One-time）：表达式只会与作用域绑定一次，当表达式的值发生改变时，页面上的视图不会自动更新；
-
支持数据的双向绑定：除了一次性的表达式外，AngularJS还提供了支持数据双向绑定的表达式，表达式绑定到作用域上的变量时，当变量的值发生改变时，视图也会相应发生改变；
-
不支持JS语句和控制结构：AngularJS使用表达式的目的是为了将视图和控制器解耦，如要使用控制结构需要使用AngularJS指令。
示例说明
示例1：在模板中使用表达式
HTML代码：
<div ng-app="" ng-init="name='AngularJS表达式'">
<p>我的第一个表达式：{{name}}</p>
</div>
上述HTML代码中，ng-app指定一个新的AngularJS应用。ng-init初始化AngularJS应用的属性。name是AngularJS应用的属性名称，AngularJS表达式{{name}}在HTML模板中会输出AngularJS表达式这个字符串。
示例2：在内嵌指令中使用表达式绑定数据
HTML代码：
<!DOCTYPE html>
<html>
<head>
<script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.7.8/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<input ng-model="name">
<h1>Hello {{name}}</h1>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.name = "AngularJS表达式示例";
});
</script>
</body>
</html>
上述HTML代码中，使用AngularJS内嵌指令ng-controller将控制范围绑定到名称为myCtrl的控制器中。ng-model指令可以将input元素上双向绑定到作用域中的变量，这里我们将input元素的值绑定到了$scope.name（在控制器myCtrl中定义的）变量中。最后将$scope.name插入到模板中，{{name}}将被替换为$scope.name的实际值。
希望对你有所帮助。