个人中心
gpt4 book ai didi

javascript - 关于我的 Anjular js 代码的错误

转载 作者：行者123 更新时间：2023-12-03 07:20:56 27 4
gpt4 key购买 nike

大家好，我是 Angular Js 的新手。我只是尝试运行此代码，但出现了一个问题“angular.js:38Uncaught Error: [$injector:modulerr]”。我找不到这是什么问题。你能帮我吗？非常感谢。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<!--The	ngApp (ng-app)	directive	is	applied	to
specify	the	root	of	the	application-->
<html lang="en" ng-app="confusionApp">
<head>
     <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head
         content must come *after* these tags -->
    <title>Ristorante Con Fusion: Menu</title>
        <!-- Bootstrap -->
    <link href="../bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="../bower_components/bootstrap/dist/css/bootstrap-theme.min.css" rel="stylesheet">
    <link href="../bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <link href="styles/bootstrap-social.css" rel="stylesheet">
    <link href="styles/mystyles.css" rel="stylesheet">

    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
    <div class="container">
        <!--The	ngInit (ng-init)	directive	is	used	to
            – Evaluate	an	expression
            – Initialize	a	JavaScript	variable-->
        <div class="row row-content" ng-controller="menuController as menuCtrl">
            <div class="col-xs-12">
                <ul class="media-list">
                    <li class="media" ng-repeat="dish in menuCtrl.dishes"> <!--dishes is the array, dish is used by the following expression-->
                        <div class="media-left media-middle">
                            <a href="#">
                                <img class="media-object img-thumbnail" ng-src={{dish.image}} alt="Uthappizza">
                            </a>
                        </div>
                        <div class="media-body">
                            <h2 class="media-heading">{{dish.name}}</h2>
                            <span class="label label-danger">{{dish.label}}</span>
                            <span class="badge">{{dish.price | currency}}</span>
                            <p>{{dish.description}}</p>
                            <p>Comment: {{dish.comment}}</p>
                            <p>Type your comment:
                                <!--The	ngModel directive	binds	the	input	value	to	a	variable	within	the	scope-->
                                <input type="text" ng-model="dish.comment"></p>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <script src="../bower_components/angular/angular.min.js"></script>
    <script>
        var app = angular.module("confusionAPP",[]); //此处module名字和ng-App处是同一个名字
        app.controller("menuController",function() {
           var dishes = [{
                name:'Uthapizza',
                image: 'images/uthapizza.png',
                category: 'mains',
                label:'Hot',
                price:'4.99',
                description:'A unique combination of Indian Uthappam (pancake) and Italian pizza, topped with Cerignola olives, ripe vine cherry tomatoes, Vidalia onion, Guntur chillies and Buffalo Paneer.',
                comment: ''
            },
                {
                    name:'Zucchipakoda',
                    image: 'images/zucchipakoda.png',
                    category: 'appetizer',
                    label:'',
                    price:'1.99',
                    description:'Deep fried Zucchini coated with mildly spiced Chickpea flour batter accompanied with a sweet-tangy tamarind sauce',
                    comment: ''
                },
                {
                    name:'Vadonut',
                    image: 'images/vadonut.png',
                    category: 'appetizer',
                    label:'New',
                    price:'1.99',
                    description:'A quintessential ConFusion experience, is it a vada or is it a donut?',
                    comment: ''
                },
                {
                    name:'ElaiCheese Cake',
                    image: 'images/elaicheesecake.png',
                    category: 'dessert',
                    label:'',
                    price:'2.99',
                    description:'A delectable, semi-sweet New York Style Cheese Cake, with Graham cracker crust and spiced with Indian cardamoms',
                    comment: ''
                }
            ];
            this.dishes = dishes;
        });
    </script>

</body>

</html>

最佳答案

您需要设置:

<html lang="en" ng-app="confusionApp">

进入此:

<html lang="en" ng-app="confusionAPP">

必须与JS代码匹配

关于javascript - 关于我的 Anjular js 代码的错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36213730/

27 4 0
文章推荐： javascript - 分解如何对数组中的数字进行排序
文章推荐： javascript - Node .js : Nested function style code is harmful than ES6 class style?
文章推荐： javascript - 用于仅匹配字符串中两个相同字符中的第一个的正则表达式
文章推荐： javascript - 在 multer 中重命名上传的文件
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com