Angular my

Добавляем описания

by Ilya Vo

HTML

<h1>Shop</h1>

<div ng-app="" ng-controller="MyCtrl">
    <input type="checkbox" ng-model="status.addStrap" ng-change="addStrap()" />Add strap! +{{stuff['strap'].price}} руб.
    <br>
    <input type="checkbox" ng-model="status.addEngraving" ng-change="addEngraving()" />And гравировку! +{{stuff['engraving'].price}} руб.
    <br>
    <select>
        <option>Пункт 1</option>
        <option>Пункт 2</option>
    </select>
    <br>
    <p>Your cart:</p>
    <p>Гравировка: {{data.engraving}}</p>
    <p>Ремешок: {{data.strap}}</p>{{add_orto_black}}
    <p>Summa: {{data.summa}}</p>
</div>

JavaScript

function MyCtrl($scope) {

    $scope.data = {
        summa: 0,
        engraving: 'нет',
        strap: 'нет',
        add_orto_black: ''
    };

    $scope.stuff = {
        strap: {
            desc: 'Кожанный',
            price: 900
        },
        engraving: {
            desc: 'Гравировка',
            price: 400
        },
        add_orto_black: {
            desc: 'Черный ортопедический доп. наконечник',
            price: 150
        }
    };

    $scope.status = {
        addEngraving: false,
        addStrap: false
    };

    $scope.addStrap = function () {
        price = $scope.stuff.strap.price;
        if ($scope.status.addStrap) {
            $scope.data.summa += price;
            $scope.data.strap = $scope.stuff.strap.desc;
        } else {
            $scope.data.summa -= price;
            $scope.data.strap = 'нет';
        }
    };

    $scope.addEngraving = function () {
        price = $scope.stuff.engraving.price;
        if ($scope.status.addEngraving) {
            $scope.data.summa += price;
            $scope.data.engraving = $scope.stuff.engraving.desc;
        } else {
            $scope.data.summa -= price;
            $scope.data.engraving = 'нет';
        }
    };


}