什么是“未定义角度”的原因

一尘不染

什么是“未定义角度”的原因

angularjs

我正在关注egghead.io上的视频教程，但是在尝试遵循他在创建工厂时的示例时，我一直收到“未定义角度”的参考错误，但是我包含了角度脚本

这是我的html页面：

<!DOCTYPE html>
<html>
    <head>
    <title>Prototype</title>
    <link rel="stylesheet" type="text/css" href="foundation.min.css">
    <script type="text/javascript" src="main.js"></script>
    </head>
    <body>

    <div data-ng-app="">

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



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


    </div>
    <script type="text/javascript" src="angular.min.js"></script>
    </body>
</html>

这是我的JavaScript文件“ main.js”：

//Services
    // step 1 create an app                             
    var myApp = angular.module('Data', []).
    // tep 2 create factory
                // Service name, function
    myApp.factory('Data', function(){
        return { message: "I'm Data from a Service" }
    });



//Controllers
    function FirstController($scope, Data){
        $scope.data = Data;
    }

    function SecondController($scope){

    }

我已经读过几篇类似的文章，如果我写错了，请纠正我，但是我认为这与引导绑定有关，并且我尝试使用手动引导，angular.bootstrap(document, ['Data']);但没有成功，仍然遇到相同的错误。

但是我想知道的是，为什么这可以在网上这么多示例中起作用，例如Egghead视频系列，但是我遇到了一些问题，因为我相信我非常关注他的视频。最新版本中角度的变化吗？

阅读 279

2020-07-04

共1个答案

一尘不染

您必须将脚本标记放在引用Angular的标记之后。将其移出head：

<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript" src="main.js"></script>

现在的设置方式是，脚本在页面上加载Angular之前运行。

2020-07-04