Question

我正在按照教程操作，然后输入以下代码 libs目录中的angular文件夹包含从https://angularjs.org/取得的Angular js的缩小版本，我得到的输出是

这里有什么问题？任何人都可以请帮助thanx ... !!!

<html lang="en" ng-app=>
    <head>
        <title>Angular Demo</title>
        <script type="text/javascript" src="lib/angular/angular.min.js"></script>
    </head>
    <body>
        <div ng-controller="MyController">
            <h1>{{author.name}}</h1>
            <p>{{author.title + ', ' + author.company }}</p>
        </div>
            <script>
            function MyController($scope)
            {
                $scope.author = {
                    'name':'aaa',
                    'title': 'bbb',
                    'company':'ccc'
                }
            }
            </script>
    </body> 
</html>

Answer 1

您必须为自己的应用命名：

.... ng-app="myApp">

并初始化：

angular.module('myApp', [])
.controller('MyController', function ($scope) {
    ...
 });

Answer 2

添加您的应用名称：

<html lang="en" ng-app="my-app">
    <head>
        <title>Angular Demo</title>
        <script type="text/javascript" src="lib/angular/angular.min.js"></script>
    </head>
    <body>
        <div ng-controller="MyController">
            <h1>{{author.name}}</h1>
            <p>{{author.title + ', ' + author.company }}</p>
        </div>
            <script>
            angular.module('my-app', []).controller('MyController' ,function MyController($scope)
            {
                $scope.author = {
                    'name':'aaa',
                    'title': 'bbb',
                    'company':'ccc'
                }
            });
            </script>
    </body> 
</html>

使用Angular，您可以为每个页面定义多个应用程序，在大多数情况下，只有一个应用程序。您可以将其用于模块化 - 创建页面的独立部分。

代码：

angular.module('my-app', []).controller(...,...)

将控制器注册到my-app应用程序。 []用于必需的依赖项，必须包含这些依赖项才能启动my-app模块。

Answer 3

angularjs在你的情况下不起作用的原因是因为你正在使用的角度VERSION。我能够让你的应用程序使用Angular 1.2.1，但不能使用Angular 1.4+。见下面的例子：

请关注@ beri的答案，了解当前Angular版本的工作示例。

<!DOCTYPE html>
<html ng-app>
  <head>
    <meta charset="UTF-8">
    <title>Angular Demo</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.min.js"></script>
  </head>
  <body>
    <div ng-controller="MyController">
      <h1>{{author.name}}</h1>
      <p>{{author.title + ', ' + author.company }}</p>
    </div>

    <script>
      function MyController($scope)
      {
        $scope.author = {
            'name':'aaa',
            'title': 'bbb',
            'company':'ccc'
        }
      }
    </script>
  </body> 
</html>

为什么angularjs在这里不起作用

3 个答案: