【发布时间】：2016-01-24 08:14:14
【问题描述】：
已编辑：下面代码中的 //Fix ... 和 //Error cmets 显示了答案
这对于 JavaScript 专家来说可能是愚蠢而明显的事情......但如果我能看到这是怎么回事，我会很危险。
这是我的 t.js：
var angularApp = angular.module('myApp', []);
angularApp.controller('mainController', ['$scope', '$http', '$log',
function ($scope, $http, $log) {
$scope.version = angular.version;
var ctime = new Date();
$scope.ctime = ctime.getTime() / 1000;
$http.get('http://127.0.0.1:8765/').then(
function(res){
$scope.stime = res['data']['server-time'] / 1000;
// Fix goes here: $scope.skew = $scope.stime - $scope.ctime;
},
function(error){
$log.warn('Unable to get time');});
// Error here: this happens asynchronously to the $http.get!
$scope.skew = parseFloat($scope.stime) - parseFloat($scope.ctime);
}]);
... 和我的 HTML：
<!DOCTYPE html>
<html lang="en-us" data-ng-app="myApp"><head><title>Time Skew</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
</head><body>
<header><nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="/">AngularJS</a></div>
<ul class="nav navbar-nav navbar-right">
<li><a href="#"><i class="fa fa-home"></i>Home</a></li>
</ul></div></nav></header>
<div class="container">
<div data-ng-controller="mainController">
<div class="ng-cloak">Browser time: {{ctime}}</div>
<div class="ng-cloak">Server time: {{stime}}</div>
<div class="ng-cloak">Time skew: {{skew}}</div></div></div>
<script src="//code.angularjs.org/1.4.7/angular.min.js"></script>
<script src="t.js"></script>
</body></html>
...下面是大致显示的内容：
Browser time: 1445735550.067
Server time: 1445735550.085
Time skew: NaN
运行此程序时，Chrome 浏览器的开发人员工具 JavaScript 控制台上没有显示任何内容。 （在本次学习期间，我在那里看到了很多其他类型的错误……所以我知道它确实显示了我的语法错误、依赖注入失败等等——当这些存在时）。
我已经尝试过使用和不使用 parseFloat()。 （此外，对 class="ng-cloak" 的调用也无关紧要……尽管它们也没有按预期工作，但将它们取出没有效果）。我从我的 * / 1000* （除法）表达式中获得所需的浮点表示这一事实表明它们在代码中的这两个点被视为数字。我尝试删除除法并使用 parseInt() 而不是 parseFloat()。
（虽然我认为这与这个问题无关，但这里是提供此时间服务的 node.js“应用程序”：
// tserver.js:
var http = require("http");
http.createServer(function (req, response) {
var headers = {
'Content-Type:': 'application/json',
// Extra headers suggested by http://stackoverflow.com/a/29548846/149076
// ... to resolve: "Control-Allow-Origin' header is present on the requested resource"
// error from Angular.js $http.get() ...
'Access-Control-Allow-Headers': 'Content-Type',
'Access-Control-Allow-Methods': 'GET, POST, OPTIONS',
'Access-Control-Allow-Origin': '*'
};
response.writeHead(200, headers);
var d = new Date();
response.end(JSON.stringify({ 'server-time': d.getTime() }));
}).listen("8765");
...虽然很明显我从我的“服务”中得到了一个有效的整数（或应该解析为整数的字符串）。 （HTML中显示的值与“ctime”在几毫秒内的值一致）。
当我发布这个问题时，我发现了一些关于 JavaScript NaN 结果的其他问题......这些似乎都不适用于这里。我什至尝试添加一个 $scope.tst = parseFloat('12345.97') - parseFloat('12345.67'); 并将其添加到我的 HTML 并得到一个完全可预测的数字结果......实际上我使用这些全长数字，如此处所示，以确保数字大小不是什么奇怪的问题。我还尝试在 $scope.Xtime 变量上调用“.toString()”。
那么我在这里做错了什么？
【问题讨论】：
标签： javascript angularjs