Javascript 简单的角度应用程序不工作_Javascript_Angularjs

Javascript 简单的角度应用程序不工作

javascript angularjs

Javascript 简单的角度应用程序不工作,javascript,angularjs,Javascript,Angularjs,简单的角度应用程序不工作代码如下： <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>JSP Page</title> <script src="//ajax.googleapis.com/ajax/li

简单的角度应用程序不工作

代码如下：

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
        <script>
            angular.module('myApp',[]).controller('SiteController', function($scope)
            {
                $scope.publisher ='sitePoint';
                $scope.type="Web Development";
                $scope.name ="Scope for site controller";
            });
            angular.module('myApp',[]).controller('BookController',function($scope)
            {
                $scope.books=['Jump Start HTML5','Jump Start CSS','Jump Start Responsive Web Design'];
                $scope.name = "Scope for book controller";
            });
        </script>
    </head>
    <body ng-app="myApp" ng-controller="SiteController">
        <span>{{publisher}} excels in {{type}} books</span>
        <div ng-controller="BookController">
            <h3>Some of the popular books from {{publisher}}</h3>
            <ul>
                <li ng-repeat="book in books">
                    {{book}}
                </li>
            </ul>
        </div>
    </body>
</html>


JSP页面
角度.module（'myApp'，[]）.controller（'SiteController'，function（$scope）
{
$scope.publisher='sitePoint'；
$scope.type=“Web开发”；
$scope.name=“站点控制器的范围”；
});
角度.module（'myApp'，[]）.controller（'BookController'，function（$scope）
{
$scope.books=['Jump Start HTML5'、'Jump Start CSS'、'Jump Start Responsive Web Design']；
$scope.name=“书本控制器的作用域”；
});
{{publisher}}擅长于{type}书籍
来自{{{出版商}的一些畅销书


{{book}}

是因为我声明了angular.module两次。请检查一下电话号码

我错过了什么？

一旦定义了模块，您就需要通过给出其名称来访问它。如果再次放置依赖项，它将创建另一个模块。。你喜欢这样吗

angular.module('myApp',[]).controller('SiteController',

然后

 angular.module('myApp').controller('BookController'

您有错误的控制器定义

angular.module('myApp',[])

定义新模块。如果为当前模块创建控制器，则必须使用：

angular.module('myApp')

检查此固定版本：

第二次删除angular.module中的

[]

选中：

您不需要在此处将数组设置为第二个参数

angular.module（'myApp'，[]）

。此语法表示您正在定义一个新模块

可以按如下方式链接控制器：

        angular.module('myApp',[]).controller('SiteController', function($scope)
        {
            $scope.publisher ='sitePoint';
            $scope.type="Web Development";
            $scope.name ="Scope for site controller";
        })
        .controller('BookController',function($scope)
        {
            $scope.books=['Jump Start HTML5','Jump Start CSS','Jump Start Responsive Web Design'];
            $scope.name = "Scope for book controller";
        });

或者，只使用getter

angular.module（'myApp'）

，而不使用第二个参数

        angular.module('myApp',[]).controller('SiteController', function($scope)
        {
            $scope.publisher ='sitePoint';
            $scope.type="Web Development";
            $scope.name ="Scope for site controller";
        });
        angular.module('myApp').controller('BookController',function($scope)
        {
            $scope.books=['Jump Start HTML5','Jump Start CSS','Jump Start Responsive Web Design'];
            $scope.name = "Scope for book controller";
        });