《Angular 权威指南》读书笔记--‘MyController is not a function,got undefine’

这是在看《Angular 权威指南》时遇到的第一个坑,书中的例子是这样的:

<!doctype html>
<html ng-app>

    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js"></script>
    </head>

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

</html>

书中用的angular是1.2的版本,我自己用的是1.4版本,运行后就报错了,说‘MyController is not a function,got undefine’。

  查了一下,出现这个问题是在angular1.3中禁止了直接在根上注册controller,原因是让根节点上(rootScope)不被挂上冗余内容,将原代码作如下修改后即可正常运行:

<!doctype html>
<html ng-app='first'>

    <head>
        <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
    </head>

    <body>
        <div ng-controller="MyController">
            <h1>Hello {{ clock }}!</h1>
        </div>
        <script type="text/javascript">
            var firstMoudle=angular.module('first',[]);
            firstMoudle.controller('MyController',MyController);
            function MyController($scope, $timeout) {
                var updateClock = function() {
                    $scope.clock = new Date();
                    $timeout(function() {
                        updateClock();
                    }, 1000);
                };
                updateClock();
            };
        </script>
    </body>

</html>            

 

posted @ 2016-09-12 12:52  FengeLiu  阅读(642)  评论(0)    收藏  举报