javascript - Angular JS 代码不工作

标签 javascript html angularjs

我从“ng-book”一书中复制了这个 angularjs 代码。但它根本不起作用...................................................... ............

<!DOCTYPE html>
<html ng-app="">
<head>
    <title>Simple App</title>

</head>
<body>
    <div ng-controller="MyController">
        Hello <span ng-bind="clock"></span>
    </div>
    <script src="angular-1.5.7/angular.js">
    </script>
    <script type="text/javascript">
        function MyController($scope){
            $scope.clock = new Date();
            var updateClock = function () {
                $scope.clock = new Date();
            };
            setInterval(function() {
                $scope.$apply(updateClock);
            }, 1000);
            updateClock();
        };

    </script>

</body>
</html>

最佳答案

  • 使用 $interval 而不是 setInterval。
  • 使用 Angular 的 $interval 时不需要 $scope.$apply()
  • 您需要定义 ng-app
  • Controller 定义应与代码片段中类似

这是一个有效的代码片段

var demoApp = angular.module('demoApp', []);
demoApp.controller('MyController', function($interval, $scope) {
  $scope.clock = new Date();
  var updateClock = function() {
    $scope.clock = new Date();
  };
  $interval(function() {
    updateClock();
  }, 1000);
  updateClock();
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html>

<head>
  <title>Simple App</title>

</head>

<body ng-app="demoApp">
  <div ng-controller="MyController">
    Hello <span ng-bind="clock"></span>
  </div>
</body>

关于javascript - Angular JS 代码不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38219821/

相关文章:

javascript - 在 Angular 中显示子 li

javascript - AngularJs 指令帮助不插入

javascript - *Highchart* 下载/打印时禁用图表标题和显示

javascript - 如何在 Javascript 中正确过滤全名字符串?

javascript - 三.ShaderMaterial不透明度不起作用

python - 如何在 Python 的 Flask 中识别通过 AJAX 发出的请求?

javascript - 匿名函数不起作用

javascript - 第二个和第三个下降在 javascript 中不起作用

html - Bootstrap 模态卡住页面

Javascript 查找包含 HTML 的字符串中单词的位置