Question

这是我的角度js和html的代码。请帮我解决这个问题。如果html文件或角度文件中的语法有任何错误，它是不是与文件一起工作？我正在尝试创建一个订单表，我正在使用角度js方法，每次当我在浏览器上运行时，Angular代码不起作用，Add按钮对我来说也不起作用，用于添加更多实体订购。

angular.module('Commande', [])
    .controller('commandeController', ['$scope', function($scope) {

        $scope.articles = [
                { id: 1, reference: 123, titre: "MSI GTX 980ti", prixUnitaire: 666.63, quantite: 0, montantHT: 666.63, montantTTC: 799.95 },
                { id: 2, reference: 456, titre: "Intel Core i7-4770K", prixUnitaire: 324.96, quantite: 0, montantHT: 324.96, montantTTC: 389.95 },
                { id: 3, reference: 789, titre: "ASUS MAXIMUS VII RANGER", prixUnitaire: 134.96, quantite: 0, montantHT: 134.96, montantTTC: 161.95 }
        ];



        $scope.PrixTotalTTC = function() {
            var resultTTC = 0;

            angular.forEach($scope.articles, function (article) {
                resultTTC += article.montantTTC * article.quantite;
            });
            return resultTTC;
        };

        $scope.PrixTotalHT = function() {
            var resultHT = 0;

            angular.forEach($scope.articles, function (article) {
                resultHT += article.montantHT * article.quantite;
            });
            return resultHT;
        };

        $scope.NombreArticle = function() {
            var resultArticle = 0;

            angular.forEach($scope.articles, function(article){
                resultArticle += article.quantite;
            });
            return resultArticle;
        };

        $scope.AjouterArticle = function() {
            $scope.articles.push({
                id: '',
                reference: '',
                titre: '',
                prixUnitaire: 0,
                quantite: 0,
                montantHT: 0,
                montantTTC: 0
            });
        };

        $scope.SupprimerArticle = function(index) {
            $scope.articles.splice(index, 1);
        };

    }]);

<html lang="en-us">
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
<script src="//code.angularjs.org/1.6.6/angular.min.js">
</script>
<script src="app.js"></script>

</head>
<body ng-app="Commande" ng-controller="commandeController">
<h1>Bon de commande</h1>
    <div class="content">
        <div class="col-md-12">
            <table class="table table-striped table-hover table-responsive">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Référence</th>
                        <th>Titre</th>
                        <th>Prix unitaire HT/€</th>
                        <th>Quantité</th>
                        <th>Montant HT/€</th>
                        <th>Montant TTC/€</th>
                        <th>Supprimer</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="article in articles">
                        <th>
                            <input type="number" ng-model="article.id" class="form-control bfh-number" placeholder="Id" min=0>
                        </th>
                        <td>
                            <input type="number" ng-model="article.reference" class="form-control bfh-number" placeholder="Référence" min=0>
                        </td>
                        <td>
                            <input type="text" ng-model="article.titre" class="form-control" placeholder="Titre">
                        </td>
                        <td>
                            <input type="number" ng-model="article.prixUnitaire" class="form-control bfh-number">
                        </td>
                        <td>
                            <input type="number" ng-model="article.quantite" class="form-control bfh-number" min=0>
                        </td>
                        <td>
                            <input type="number" ng-model="article.montantHT" class="form-control bfh-number" min=0>
                        </td>
                        <td>
                            <input type="number" ng-model="article.montantTTC" class="form-control bfh-number" min=0>
                        </td>
                        <td>
                            <a href ng:click="SupprimerArticle($index)"><i class="fa fa-times delete"></i></a>
                        </td>
                    </tr>
                    <tr class="success">
                        <th class="success">TOTAL</th>
                        <td class="success"></td>
                        <td class="success"></td>
                        <td class="success"></td>
                        <td class="success">{{ NombreArticle() }} article(s)</td>
                        <td class="success" ng-style="PrixTotalHT() >= 1000 && {'font-weight': 'bold'}">{{ PrixTotalHT() | number:2 }} €</td>
                        <td class="success" ng-style="PrixTotalHT() >= 1000 && {'font-weight': 'bold'}">{{ PrixTotalTTC() | number:2 }} €</td>
                        <td class="success"></td>
                    </tr>
                </tbody>
            </table>
            <a href ng:click="AjouterArticle()" class="btn btn-primary">Ajouter un article <i class="fa fa-plus"></i></a>
        </div>
    </div>
</body>
</html>

这是我的代码。

Answer 1

听起来您需要内容管理系统（ CMS ），例如MAMP，XAMPP或类似内容。您基本上需要运行本地服务器才能使用JavaScript代码（以及您可能使用的任何PHP）。简单的解决方案，如果只需要JavaScript，就是使用Node.js.

为什么我的Angular js代码不起作用？

1 个答案: