提示

Question

所以我已经知道，当我看到答案时，我会感到非常愚蠢，但我正在使用egghead.io的AngularJS教程。当我这样做时：

<!DOCTYPE html>
<html>
    <head>
        <title>AngularJS Tutorials</title>
        <link rel="stylesheet" href="/foundation/stylesheets/foundation.min.css">
        <script src="js/main.js"></script>
        <script src="lib/angular/angular.js"></script>
    </body>
    </head>
    <body>
        <div ng-app="myApp">

            <div ng-controller="FirstCtrl">
                <input type="text" ng-model="data.message">
                <h1>{{ data.message }}</h1>
            </div>

            <div ng-controller="SecondCtrl">
                <input type="text" ng-model="data.message">
                <h1>{{ data.message }}</h1>
            </div>
        </div>  
</html>

使用我的JavaScript文件（名为main.js）：

var myApp = angular.module('myApp', []);
myApp.factory('Data', function() {
    return { message: "I'm data from a service"}
})

function FirstCtrl($scope, Data) {
    $scope.data = Data;
}

function SecondCtrl($scope, Data) {
    $scope.data = Data;
}

我的{{ data.message }}未被识别为AngularJS绑定（即在其显示为的页面中）
{{ data.message }}代替"I'm data from a service"）。但是，如果我将所有JS代码直接放入HTML中的<script></script>标记中，它就能正常工作。我错过了参考或其他什么？似乎没有在任何地方找到这个，可能是因为它非常基本。

Answer 1

我要 JUMP THE GUN 并建议你切换这些

<script src="js/main.js"></script>
<script src="lib/angular/angular.js"></script>

到

<script src="lib/angular/angular.js"></script>
<script src="js/main.js"></script>

如果这样可行则那是因为在你没有加载事件时尝试使用angular。

提示


现在，当我第一次开始使用javascript时，这些事情曾经发生在我身上。您要做的最好的事情是学习如何使用它在控制台中告诉您的console cannot read property 'module' of undefined，这意味着angular是undefined因此没有加载。

Answer 2

在控制器之前加载Angular，而不是在

之后

Answer 3

在行之间切换：

<script src="js/main.js"></script>
<script src="lib/angular/angular.js"></script>

你需要在加载角度后运行main.js

AngularJS无法识别控制器

3 个答案:

提示