Question

我正在尝试按照教程熟悉Angular。因此，如果这个问题非常简单，我会事先道歉。在我的index.html中，我试图调用其中一个控制器来测试Angular如何调用某些东西。

在代码中，我有<div ng-controller="listCtrl">。但是，像{{3+5}}这样简单的事情并没有被评估并按原样打印到页面上。我尝试过使用ng属性和我有类似

之类的东西

<div ng-app="">
    {{3+5}}
</div>

它会工作并打印出来8.我想知道是否有人可以查看代码（下面发布的）并告诉我我做错了什么。

我的index.html文件：

<!doctype html>
<html lang="en" ng-app="turtleFacts">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"
        integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS"
        crossorigin="anonymous"></script>

</head>
<body>
<div class="container">
    <div class="page-header">
        <h1>Heading</h1>
        <h3>Heading3
        <strong>QUIZ</strong>
        </h3>
</div>

<div ng-controller="listCtrl">
    {{dummyData}}
</div>

</div>

<!-- My application scripts -->
<script src="js/app.js"></script>
<script src="js/controllers/list.js"></script>

</body>
</html>

我的list.js：

(function(){
    angular
        .module("turtleFacts")
        .controller("listCtrl", ListController);

    function ListController($scope) {
        $scope.dummyData = "hello world";
    }
})

我的app.js：

(function() {
    angular
        .module("turtleFacts", []);
})();

我的文件夹结构如下：

Project
 |
 +-- css
 |    
 +-- js
 |  |  
 |  +-- controllers
 |  |  |
 |  |  +-- list.js
 |  | 
 |  +-- app.js
 |    
 +-- index.html

我的假设是页面应该有＆＃34; Hello World＆＃34;但我得到的只是{{dummyData}}。如果我能提供您可能需要的任何其他信息，请告诉我。谢谢！

Answer 1

在list.js中，您忘了在IIFE结束时添加();：）

为什么我的ng控制器没有被调用？

1 个答案: