angularjs 构建主页 内置过滤器、日期的格式化

从构建负责管理主屏幕的 MainController 开始。在这个 MainController 控制器内，只需设
置一个每秒运转一次，同时更新一个局部作用域变量的延时

1 angular.module('myApp', [])
2 .controller('MainController', function($scope, $timeout) {
3 // 构建date对象
4 $scope.date = {};
5 // 更新函数
6 var updateTime = function() {
7 $scope.date.raw = new Date();
8 $timeout(updateTime, 1000);
9 };
10 // 启动更新函数
11 updateTime();
12 });

angular.module('myApp', [])
.controller('MainController', function($scope, $timeout) {
// 构建date对象
$scope.date = {};
// 更新函数
var updateTime = function() {
$scope.date.raw = new Date();
$timeout(updateTime, 1000);
};
// 启动更新函数
updateTime();
});

MainController 内的 updateTime() 函数每秒都会运行，以便更新 $scope.date.raw 时间戳，
同时更新视图

<div class="container">
<div ng-controller="MainController">
{{ date.raw }}
</div>
</div>

目前，浏览器中的这个日期还非常丑陋。我们可以利用Angular内置的过滤器以更优雅的方
式来格式化这个日期。

<div class="container">
　　<div ng-controller="MainController">
　　　　<div id="datetime">
　　　　　　<h1>{{ date.raw | date:'hh mm ss' }}</h1>
　　　　</div>
　　</div>
</div>

你可以在视图中添加另一个日期，以人性化的方式来显示当前日期。只要再添加一个格式化
的日期就可以了：
<!-- ... -->
<div id="datetime">
<h1>{{ date.raw | date: 'hh mm ss' }}</h1>
<h2>{{ date.raw | date: 'EEEE, MMMM yyyy' }}</h2>
</div>
<!-- ... -->