Question

我的代码来自ng-book：

<!doctype html>
<html ng-app>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular.js"></script>
</head>
<body>
    <div ng-controller="MyController">
        <h1>Hello {{ clock.now }}!</h1>
    </div>
    <script type="text/javascript">
    function MyController($scope) {
        var updateClock = function() {
            $scope.clock.now = new Date();
        };
        setInterval(function() {
            $scope.$apply(updateClock);
        }, 1000);
        updateClock();
    };
    </script>
  </body>
</html>

我解决了这个问题：

<!doctype html>
<html ng-app>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular.js"></script>
</head>
<body>
    <div ng-controller="MyController">
        <h1>Hello {{ clock }}!</h1>
    </div>
    <script type="text/javascript">
    function MyController($scope) {
        var updateClock = function() {
            $scope.clock = {'now': new Date()};
        };
        setInterval(function() {
            $scope.$apply(updateClock);
        }, 1000);
        updateClock();
    };
    </script>
  </body>
</html>

我的问题是为什么第一个代码不起作用？

更新：更新了第二个代码。

Answer 1

使用$scope.clock.now = new Date();您尝试将属性now设置为未定义的对象（clock）。使用$scope.clock = {'now': new Date()};将clock设置为对象，然后分配属性。一个冗长的方式是：

$scope.clock = {}; 
$scope.clock.now = 'value';

Answer 2

因为第一个例子中的时钟对象上没有'now'属性

Answer 3

Date的now（）方法是一个静态方法，所以你可以这样说：

<div ng-controller="MyController">
    <h1>Hello {{ clock.now() }}!</h1>
</div>
<script type="text/javascript">
function MyController($scope) {
    var updateClock = function() {
        $scope.clock = Date;
    };

如果你真的想调用date对象的now方法，它会给你毫秒。

Answer 4

第一个代码无效，因为没有定义 $ scope.clock （Angular会引发错误： TypeError：无法设置'now'属性'undefined ）

所以这个

$scope.clock.now = new Date();

应该是这样的：

$scope.clock = {};
$scope.clock.now = new Date();

或者像你解决了它：

$scope.clock = {now: new Date()}

Angular：范围变量

4 个答案: