AngularJS简单的"Hello,world"无法正常工作

Abu*_*ish 23 angularjs

试图按照教程,我不能让"Hello,world"示例正常工作.而是显示:"{{greeting.text}},world".使用Chrome和AngularJS 1.3.1.

index.html的:

<!DOCTYPE html>
<html ng-app>
    <head>
        <script src="angular.js"></script>
        <script src="app.js"></script>
        <!--<link rel="stylesheet" type="text/css" href="bootstrap.min.css" />-->
    </head>
    <body>
        <div ng-controller='HelloController'>
            <p>{{greeting.text}}, world </p>
        </div>
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

app.js

function HelloController($scope) {
    $scope.greeting = { text: 'Hello' };
}
Run Code Online (Sandbox Code Playgroud)

我的文件夹结构

root/
    angular.js
    app.js
    index.html
Run Code Online (Sandbox Code Playgroud)

谢谢

小智 29

我希望这有帮助.

的index.html

<!DOCTYPE html>
<html ng-app="appname">

  <head>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.min.js"></script>
    <link href="style.css" rel="stylesheet"/>
    <script src="script.js"></script>
  </head>

  <body>
    <div ng-controller="appCtrl">
      <p>{{greeting.text}}, world </p>
    </div>
  </body>

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

的script.js

var appname = angular.module('appname', []);
appname.controller('appCtrl', ['$scope',
  function($scope) {
    $scope.greeting = { text: 'Hello' };
}]);
Run Code Online (Sandbox Code Playgroud)

http://plnkr.co/edit/XmliRcmsZvuQimHoyjN5?p=preview

  • 但为什么前一个不起作用?他们改变了什么吗? (9认同)
  • 那么问题中的代码有什么问题? (5认同)

Ike*_*ayo 13

回答问题是什么,如果他们改变了什么.

  • AngularJs 1.2或更早版本:控制器可以是未定义到模块中的函数.就像问题一样.

调节器

function HelloController($scope) {
    $scope.greeting = { text: 'Hello' };
}
Run Code Online (Sandbox Code Playgroud)
  • Angular Version 1.3或更高版本:必须将控制器定义到模块中.喜欢在答案中.

调节器

var appname = angular.module('appname', []);
appname.controller('appCtrl', ['$scope',
  function($scope) {
    $scope.greeting = { text: 'Hello' };
}]);
Run Code Online (Sandbox Code Playgroud)