初始化Angular"Hello World"应用程序

MoS*_*ikh 4 javascript angularjs

真正基本的问题:一个"hello world"应用程序开始练习Angular工作,直到我尝试添加控制器,此时表达式在页面上不起作用.

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

<head>
    <link rel='stylesheet' href='css/styles.css'>
    <link rel='stylesheet' href='css/bootstrap.min.css'>
    <script src='js/app.js'></script>
    <script src='js/angular.min.js'></script>
</head>

<body>
    <div class='container col-md-6 col-md-offset-6 panel' ng-controller='FormController'>
        <input type='text' ng-model='name' placeholder='Enter your name'>
        <h1>Hello {{name}}</h1>
    </div>

</body>

</html>
Run Code Online (Sandbox Code Playgroud)

JS:

angular.module('app', []).controller('FormController', function($scope){
    $scope.name = 'Test';
});
Run Code Online (Sandbox Code Playgroud)

该页面最终显示{{name}},但如果我取出控制器和'app'模块,它就可以正常工作.帮助会很棒,谢谢.

Had*_*i J 6

您应该更改包含js文件的顺序.

<script src='js/angular.min.js'></script>
<script src='js/app.js'></script>
Run Code Online (Sandbox Code Playgroud)