码迷,mamicode.com
首页 > Web开发 > 详细

AngularJS学习(二)

时间:2015-05-07 10:34:59      阅读:128      评论:0      收藏:0      [点我收藏+]

标签:angularjs   表达式   变量   javascript   控制器   

AngularJS 表达式 很像 JavaScript 表达式:它们可以包含文字、运算符和变量。

<h2>AngularJS 数字</h2>
<div ng-app="" ng-init="quantity=1;cost=5">
   <p>总价:{{quantity*cost}}</p>
    <p>总价: <span ng-bind="quantity * cost"></span></p>
</div>


<h2>AngularJS 字符串</h2>
<div ng-app="" ng-init="name=‘Lanfeng‘;sex=‘女">
    <p>字符串:{{name+‘ ‘+sex}}</p>
    <p>字符串: <span ng-bind="name+‘ ‘+sex"></span></p>
</div>


<h2>AngularJS 对象</h2>
<div ng-app="" ng-init="obj={name:‘Lanfeng‘,age:15}">
    <p>对象:{{obj.name+‘ ‘+obj.age}}</p>
    <p>对象: <span ng-bind="obj.name+‘ ‘+obj.age"></span></p>
</div>


<h2>AngularJS 数组</h2>
<div ng-app="" ng-init="numArr=[1,5,10,13]">
    <p>数组:{{numArr[2]}}</p>
    <p>数组: <span ng-bind="numArr[2]"></span></p>
</div>

<h2>AngularJS 控制器</h2>
<div ng-app="" ng-controller="MyController">
   <p>x姓名:<input type="text" ng-model="person.name"></p>
    <p>性别: <input type="text" ng-model="person.sex"></p>
    <div>姓名: {{person.name}}  </div>
    <div>性别:{{person.sex}}</div>
</div>
<script type="text/javascript">
    function MyController($scope){
        $scope.person = {
            name:"LanFeng",
            sex:"女"
        }
    }
</script>

AngularJS学习(二)

标签:angularjs   表达式   变量   javascript   控制器   

原文地址:http://blog.csdn.net/lfcss/article/details/45555965

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!