AngularJS：helloworld显示当前时间的案例
程序员文章站
2022-06-07 19:13:29
Angular JS：第一个小案例
...
Angular JS：第一个小案例
<!DOCTYPE html>
<html ng-app="app">
<head>
<meta charset="utf-8" />
<title>Angular JS Hello World!</title>
<script src="https://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>
<p ng-controller="mainController">
<h1>Hello {{ message }}</h1>
</p>
<p ng-controller="myController">
<h1>当前时间 : <font color="orangered">{{ clock }}</font></h1>
</p>
</body>
<script>
var myApp = angular.module('app', []);
myApp.controller('mainController', function($scope) {
$scope.message = "Plunker";
});
myApp.controller('myController', function($scope, $timeout) {
var updateClock = function() {
var da = new Date();
var year = da.getFullYear()+'年';
var month = da.getMonth()+1+'月';
var dates = da.getDate()+'日';
var now = year+month+dates;
var s = da.getHours()+'时';
var f = da.getMinutes()+'分';
var m = da.getSeconds();
now = now +s+f+m;
$scope.clock = now;
$timeout(function() {
updateClock();
}, 1000);
};
updateClock();
});
</script>
</html>
上一篇： JS基础之语法的作用和使用实例讲解