Question

我用棱角分明创造了一个简单的helloworld但是我无法看到它的结果！我的angular.min.js位于html文件中，并在浏览器中正确加载。我的代码：

<!DOCTYPE html>
<html>
    <head lang="en">
    <meta charset="UTF-8">
            <title></title>
    </head>

<body>
    <h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1>

    <script src="angular.min.js"></script>
    <script type="text/javascript">
        function HelloWorldCtrl($scope){
            $scope.helloMessage = "Hello Mohammad";
        }
    </script>
</body>
</html>

结果：{{helloMessage}}

Answer 1

ng-app需要在那里，如果你有任何模块，那么你可以给ng-app =＆＃34; modulename＆＃34;或者您可以使用ng-app自动引导。它告诉浏览器你正在引导angular.js应用程序

 <html ng-app>

更新：使用angular 1.3，您无法再在全局范围内使用全局控制器声明。你必须使用控制器声明

 angular.module('myapp', []).controller('HelloWorldCtrl', function(){
    $scope.helloMessage = "Hello Mohammad";
 });

工作演示：

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
    <html ng-app="myapp">
    <head lang="en">
    <meta charset="UTF-8">
    <title></title>
    </head>
    <body>
    <h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1>
    
    <script src="angular.min.js"></script>
    <script type="text/javascript">
       angular.module('myapp', []).controller('HelloWorldCtrl', function($scope){
      $scope.helloMessage = "Hello Mohammad";
      });
    </script>
    </body>
    </html>

＆＃13;

Answer 2

您需要使用ng-app并且需要声明控制器：

<html>
<head></head>
<body ng-app="myApp">
<h1 ng-controller="HelloWorldCtrl as ctrl">{{ctrl.HelloMessage}}</h1>
<script
  src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.js">
</script>
<script>
angular.module('myApp', [])
    .controller('HelloWorldCtrl', [function() {
       this.HelloMessage = 'Hello';
  }]);
</script>
</body>
</html>

以上作品已经过测试和运作。

AngularJs不能在一个简单的项目中工作

2 个答案: