在 AngularJS 中,表达式(Expressions)是一种轻量级的语法,用于在视图中绑定和显示数据。表达式以双花括号 ({{}}) 的形式出现在 HTML 或指令属性中,被 AngularJS 解析并渲染为实际的值。

以下是 AngularJS 表达式的一些基本用法:

1. 显示变量的值
<!-- 显示变量 message 的值 -->
<p>{{ message }}</p>

2. 运算
<!-- 显示两个变量相加的结果 -->
<p>{{ num1 + num2 }}</p>

3. 调用函数
<!-- 调用函数并显示结果 -->
<p>{{ calculateSum(num1, num2) }}</p>

4. 条件判断
<!-- 使用条件表达式 -->
<p>{{ isLoggedIn ? 'Welcome' : 'Please log in' }}</p>

5. 迭代
<!-- 使用 ng-repeat 迭代数组中的元素 -->
<ul>
  <li ng-repeat="item in items">{{ item }}</li>
</ul>

6. 过滤器
<!-- 使用过滤器格式化数据 -->
<p>{{ currentDate | date:'yyyy-MM-dd' }}</p>

7. 链式调用
<!-- 链式调用多个表达式 -->
<p>{{ user.name | uppercase | reverse }}</p>

需要注意的是,AngularJS 表达式有一些限制,不能包含循环、条件语句等复杂的 JavaScript 语句。它主要用于简单的数据绑定和显示。

表达式是轻量级的,适用于简单的场景,但对于复杂的逻辑,建议将这些逻辑移到控制器(Controller)中,以保持视图的简洁和可读性。

在 AngularJS 中,表达式是单向绑定的,即数据变化会影响视图,但视图的变化不会反过来影响数据。双向数据绑定是通过指令和控制器来实现的。


转载请注明出处:http://www.pingtaimeng.com/article/detail/4855/Angular