AngularJS（十一）表达式

转载地址：http://www.cnblogs.com/liulangmao/p/3720214.html

本篇只要介绍angular表达式:

在之前的例子中,我们多半是直接把数据作为angular标识符的值,但其实可以使用表达式来做更多的事情:

比如:

{{number}} 

也可以是: {{number+10}} (将数据进行简单的运算)

也可以是: {{someFun()/10}} (调用方法得到结果,同时经过简单运算)

又比如:

ng-class={hight: ifHigh}

也可以是: {hight: $index%4 >= compute($index)} (调用方法,简单运算,传入参数)

 

以上这些仅仅是举例,表达式虽然方便,但实际中应该尽量把带有逻辑的运算放入控制器中,而不是在ui中进行.

表达式是用angular自定义的解析方式计算的,不是javascript的eval(),因此是有限的.只限用于一些基本,简单的操作,比如:

计算(+,-,*,/%)

比较(==,!=,<,>,>=,<=)

布尔逻辑(&&,||,!)

数组和对象([],{})

调用方法,传入参数(fun(i))

 

不能够使用:

++,--,if,else,throw,for,while,...

 

表达式最大的有点在于,能够兼容undefined和null,不会报错,而是简单的不渲染任何内容.而一旦它被赋值了,就会立刻显示正确的内容

 

本篇只要介绍angular表达式:

在之前的例子中,我们多半是直接把数据作为angular标识符的值,但其实可以使用表达式来做更多的事情:

比如:

{{number}} 

也可以是: {{number+10}} (将数据进行简单的运算)

也可以是: {{someFun()/10}} (调用方法得到结果,同时经过简单运算)

又比如:

ng-class={hight: ifHigh}

也可以是: {hight: $index%4 >= compute($index)} (调用方法,简单运算,传入参数)

 

以上这些仅仅是举例,表达式虽然方便,但实际中应该尽量把带有逻辑的运算放入控制器中,而不是在ui中进行.

表达式是用angular自定义的解析方式计算的,不是javascript的eval(),因此是有限的.只限用于一些基本,简单的操作,比如:

计算(+,-,*,/%)

比较(==,!=,<,>,>=,<=)

布尔逻辑(&&,||,!)

数组和对象([],{})

调用方法,传入参数(fun(i))

 

不能够使用:

++,--,if,else,throw,for,while,...

 

表达式最大的有点在于,能够兼容undefined和null,不会报错,而是简单的不渲染任何内容.而一旦它被赋值了,就会立刻显示正确的内容