Question

我在angularjs中运行一个非常基本的程序，但不知道为什么脚本没有加载评估标签显示在视图页面上。

有谁能告诉我这个程序有什么问题？

     <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
     <html ng-app='myApp'>
     <head>
     <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
     <title>Your Shopping Cart</title>
     <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>

      </head>
     <body ng-controller='CartController'>
     <h1>Your Order</h1>
    <div ng-repeat='item in items'>
    <span>{{item.title}}</span>
   <input ng-model='item.quantity'>
   <span>{{item.price | currency}}</span>
  <span>{{item.price * item.quantity | currency}}</span>
  <button ng-click="remove($index)">Remove</button>
   </div>

  <script type="text/javascript">
  function CartController($scope) {
  $scope.items = [
  {title: 'Paint pots', quantity: '8', price: '3.95'},
  {title: 'Polka dots', quantity: '17', price: '12.95'},
  {title: 'Pebbles', quantity: '5', price: '6.95'}
   ];
 $scope.remove = function(index) {
 // splice is an ECMA javascript function
$scope.items.splice(index, 1);
   }
   }
  </script>
  </body>
  </html>

我试过这段代码，运行正常

<!DOCTYPE html>
<html ng-app>
<head>
<title>Hello World</title>
 <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
</head>
<body>
<div ng-controller="ContactController">
    Email:<input type="text" ng-model="newcontact"/>
    <button ng-click="add()">Add</button>
    <h2>Contacts</h2>

 <ul>
    <li ng-repeat="contact in contacts"> {{ contact }} </li>
   </ul>

 </div>
 <script type="text/javascript">
function ContactController($scope) {
    $scope.contacts = ["hi@email.com", "hello@email.com"];

    $scope.add = function() {
    $scope.contacts.push($scope.newcontact);
    $scope.newcontact = "";
    }
}
   </script>
   </body>
   </html>

Answer 1

您没有宣布您的角度应用。试试这个：

var app = angular.module('myApp', []);
app.controller('CartController',function CartController($scope) {
    $scope.items = [
    {title: 'Paint pots', quantity: '8', price: '3.95'},
    {title: 'Polka dots', quantity: '17', price: '12.95'},
    {title: 'Pebbles', quantity: '5', price: '6.95'}
    ];
    $scope.remove = function(index) {
        // splice is an ECMA javascript function
        $scope.items.splice(index, 1);
    }
 });

Answer 2

改变这个：

<html ng-app='myApp' >

到这个

<html ng-app >

您没有名为'myApp'

的模块

DEMO

AngularJs有时不加载

2 个答案: