angular.repeat

by swordf1zh

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<div ng-app>
    <form role="form" class="row" ng-controller="ProdCtrl">
        <!-- Secciones -->
        <div class="col-md-4" ng-repeat="section in sections">
            <blockquote class="text-center">{{section.name}}</blockquote>
            <div ng-repeat="product in products">
                <div class="form-group">
                    <div class="input-group">	<span class="input-group-addon">{{product.name}}</span>

                        <input type="text" class="form-control text-center" placeholder="Cantidad" ng-model="total">
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-4">
            <blockquote class="text-center">Inventario Final</blockquote>
            <div ng-repeat="product in products">
                <div class="form-group">
                    <div class="input-group">	<span class="input-group-addon">{{product.name}}</span>

                        <p class="form-control text-center">{{product.total}}</p>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

JavaScript

function ProdCtrl($scope) {

	    $scope.sections = [{
	        id: 1,
	        name: 'Inventario Inicial'
	    }, {
	        id: 2,
	        name: 'Producción'
	    };

	    $scope.products = [{
	        id: 1,
	        name: 1,
	        total: 0
	    }, {
	        id: 2,
	        name: 2,
	        total: 0
	    }, {
	        id: 3,
	        name: 3,
	        total: 0
	    }, {
	        id: 4,
	        name: 4,
	        total: 0
	    }];

	    $scope.add = function (cantidad) {
	        $scope.product.total += cantidad;
	    }
	};