首页 > 代码库 > AngularJs 表达式
AngularJs 表达式
AngularJs 表达式
AngularJs 表达式写在双大括号内:{{expression}}
AngularJs 表达式把数据绑定到HTML,这与ng-bind有异曲同工之妙。
AngularJs 将在表达式书写的位置输出数据。
AngularJs 表达式 很想javascript表达式:它们可以包含文字、运算符和变量。
eg:{{5 + 5}}或{{firstName + " " + lastName}}
<div ng-app = "angu" ng-controller="myCtro"> <input type="text" ng-model = "firstName"> <input type="text" ng-model = "lastName"> <span ng-bind = "name"></span> <p>表达式:{{firstName + "5" + lastName}}</p> </div> <script> var app = angular.module("angu",[]); app.controller("myCtro",function($scope){ }) </script>
AngularJs 数字:
<div ng-app = "angu" ng-controller="myCtro" ng-init="quantity=2;price=5"> <p>总价:{{quantity * price}}</p> <!--总价:10--> </div> <script> var app = angular.module("angu",[]); app.controller("myCtro",function($scope){ }) </script>
使用ng-bind的相同实例:
<div ng-app = "angu" ng-controller="myCtro" ng-init="quantity=2;price=5"> <p> 总价:<span ng-bind="quantity * price"></span> </p> <!--总价:10--> </div> <script> var app = angular.module("angu",[]); app.controller("myCtro",function($scope){ }) </script>
AngularJs 字符串:
<div ng-app = "angu" ng-controller="myCtro" ng-init="firstName=‘John‘;lastName=‘Don‘"> <p> 姓名:{{firstName +" "+ lastName}} </p> </div> <script> var app = angular.module("angu",[]); app.controller("myCtro",function($scope){ }) </script>
使用ng-bind的相同实例:
<div ng-app = "angu" ng-controller="myCtro" ng-init="firstName=‘John‘;lastName=‘Don‘"> <p> 姓名:<span ng-bind="firstName +‘ ‘+ lastName"></span> </p> </div> <script> var app = angular.module("angu",[]); app.controller("myCtro",function($scope){ }) </script>
AngularJs 对象:
<div ng-app = "angu" ng-controller="myCtro" ng-init="person={firstName:‘John‘,lastName:‘Don‘}"> <p> 姓名:{{person.firstName +‘ ‘+ person.lastName}} </p> </div> <script> var app = angular.module("angu",[]); app.controller("myCtro",function($scope){ }) </script>
使用ng-bind的相同实例:
<div ng-app = "angu" ng-controller="myCtro" ng-init="person={firstName:‘John‘,lastName:‘Don‘}"> <p> 姓名:<span ng-bind="person.firstName +‘ ‘+ person.lastName"></span> </p> </div> <script> var app = angular.module("angu",[]); app.controller("myCtro",function($scope){ }) </script>
AngularJs 数组:
<div ng-app = "angu" ng-controller="myCtro" ng-init="person=[‘sing‘,‘dance‘,‘draw‘]"> <p> 爱好:{{person[2]}} </p> </div> <script> var app = angular.module("angu",[]); app.controller("myCtro",function($scope){ }) </script>
使用ng-bind的相同实例:
<div ng-app = "angu" ng-controller="myCtro" ng-init="person=person=[‘sing‘,‘dance‘,‘draw‘]"> <p> 爱好:<span ng-bind="person[2]"></span> </p> </div> <script> var app = angular.module("angu",[]); app.controller("myCtro",function($scope){ }) </script>
AngularJs 表达式与Javascript表达式
类似于javascript表达式,AngularJs表达式可以包含字母,操作符,变量。
与Javascript 表达式不同,AngularJs表达式可以写在HTML中。
与Javascript 表达式不同,AngularJs表达式不支持条件判断,循环,异常。
与Javascript 表达式不同,AngularJs表达式支持过滤器。
AngularJs 表达式
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。