Question

我知道这不会被认为是一个很好的Stackoverflow问题，但我不能为我的生活弄清楚为什么这不会起作用（基于Angular's own tutorials我跟随）和我没人问。

我在浏览器中打开我的HTML。该文件看起来完全像这样：

<!DOCTYPE html>
<html>
<head ng-app="MyFirstApp">
    <title>My Page</title>
    <script src="bower_components/angular/angular.js"></script>
    <script>
        var mod = angular.module("MyFirstApp", []);
        mod.controller('myController', function($scope){
            alert("Hi");
            $scope.a = 5;
        });
    </script>
</head>
<body ng-controller="myController">
<h1> My Body </h1>
<div>
    <h1>{{a}}</h1>
</div>
</body>
</html>

一切都很好，控制台中没有错误。我检查了两次和三次，并且所有变量拼写正确。

你能告诉我它为什么不起作用吗？

Answer 1

把

html或正文中的

ng-app="MyFirstApp"

像

<html ng-app="MyFirstApp">

OR

<body ng-app="MyFirstApp">

如果您定义了ng-app，例如<head ng-app="MyFirstApp">这个，则表示您的应用。范围是在head标记中放置的，因此它对身体不可见，但只能在head中显示。

Answer 2

嘿，你只是忽略了角度的嵌套。控制器链接到模块，可在模块内访问在您的情况下，您已定义模块 MyFirstApp 并将其添加到 head 标记。因此，链接控制器可在头标记的后代内访问。但是在这里你已经将控制器 myController 添加到head标签之外的body标签。

为什么我的简单Angular.js应用程序不起作用？

2 个答案: