AngularJS ng-repeat不起作用

时间:2014-01-25 23:24:32

标签: angularjs ng-repeat

我是AngularJS的新手并处于学习阶段。 我正在尝试使用ng-repeat,将控制器放在一个单独的js文件中。 当我跑,没有任何显示。它只是空白

的index.html

<html data-ng-app="">
    <head>
        <script src="/Scripts/angular.js"></script>
        <script src="/controllers/controller.js"></script>
    </head>
    <body data-ng-contoller='CartController'>
        <div data-ng-repeat="item in Items">
            <span>{{item.Name}}</span>
            <span>{{item.Buyer}}</span>
            <input type="text" data-ng-model="item.Quantity" />
            <span>{{item.Price}}</span>
            <span>Total Price</span>{{item.Quantity * item.Price | currency}}
            <button data-ng-click="remove($index)">Remove</button>
        </div>
    </body>
</html>

controller.js:

function CartController($scope) {
$scope.Items=
   [{ Name: "Books", Quantity:12,Price : 20, Buyer: "Wei-Meng Lee" },
    { Name: "Pencils", Quantity: 17, Price : 35, Buyer: "Scott Allen" },
    { Name: "Markers", Quantity: 2, Price: 30, Buyer: "Adam Fazio" }];

$scope.remove = function(index) {
    $scope.Items.splice(index, 1);
};

$scope.$apply();

}

1 个答案:

答案 0 :(得分:1)

这是错字data-ng-contoller而不是data-ng-controller。正确的将是:

<body data-ng-controller='CartController'>