当前位置： 移动技术网 > IT编程>开发语言>JavaScript > AngularJS：helloworld显示当前时间的案例

AngularJS：helloworld显示当前时间的案例

2018年05月10日  | 移动技术网IT编程  | 我要评论
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>

 

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网