AngularJS语法介绍



作业回顾


将上节课的AngularJs模式部分的代码稍作修改,具体修改如下图所示:


js2.png



实例


实例一:简单的表达式(字符串、数字)


实例二:时间


实例三:数组


实例四:对象


代码示例:


<!doctype html>
<html ng-app="lesson" ng-controller="lesson2" ng-init=" AccountId=1 ; AccountName ='Tom' ; Location ='CHINA' ; AccountInfo ={'AccountId':2,'AccountName':'Tommy','Location':'CHINA-ShangHai'} ; Week = ['Mon','Tue','Wen','Thu','Fri','Sat','Sun']  " >
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>
LESSON 2
  </title>
  <link rel="stylesheet" type="text/css" href="css/main.css" />
  <style>
  #content1{padding:16px;}
  </style>
 
  </head>
 
  <body>
  
<b>{{ Now }}</b>
  
<b style="color:blue;">{{ Week[1] }}</b>
  
<ul>
<li>{{ AccountInfo.AccountId }}</li>
<li>{{ AccountInfo.AccountName }}</li>
<li>{{ AccountInfo.Location }}</li>
</ul>
  
<script src="scripts/angular-1.0.1.min.js"></script>
<script>
var app = angular.module("lesson",[]);
app.controller("lesson2",function($scope){
var now = new Date();
$scope.Now = now.getHours()+":"+now.getMinutes()+":"+now.getSeconds();
});
 
</script>
 
  </body>
</html>


执行结果:


js3.png



小结


希望大家多动手,毕竟程序开发是一个熟能生巧的过程。



作业


这个时间是我们浏览网页时候的时间,作业要求大家更改,让时间可以随着流逝自动更新,类似表的情况,希望大家去试试。


js4.png



【本文由大发二分彩—大发三分彩官方独家原创,转载请注明出处并保留原文链接】

logo
© 2012-2016 tvqo.cn
蜀ICP备13014270号-4 Version 5.0.0 release20160127

免费领取价值1888元求职宝典!

客服热线 400-862-8862

回到顶部