-1

私は学んでいて、Angular js の初日です。モデルコントローラービューがどのように機能するかを学びましたangular jsが、次のコードは変数を表示していませんが、代わりに通常の {{}}HTMLビューをng-repeat使用せずに表示します:

<html ng-app='myApp'>
    <head>
        <title>Your Shopping Cart</title>
    </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 src="lib/angular.js"></script>
        <script>
            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) {
                    $scope.items.splice(index, 1);
                }
            }
        </script>
    </body>
</html>

コードの何が問題になっていますか?

4

3 に答える 3

4

myAppモジュールを定義する必要があります。

var app = angular.module('myApp', []);
app.controller('CartController', ['$scope', function($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) {
        $scope.items.splice(index, 1);
    }
}]);

DEMO

于 2013-10-25T11:12:38.930 に答える