JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="http://unionerp.com.br/media/javascript/production/unionerp.min.js"></script>
<div ng-app="myApp" ng-controller="PushController">
    <div style="float: left; width: 25%; margin-right: 10px;">Valor
        <br />
        <input type="text" style="width: 100%; text-align: right;" ng-model="discrimination.value" format="priceformat" placeholder="R$ 0,00" class="money" />
    </div>
    <div style="float: left; width: 25%; margin-right: 10px;">Adicional
        <br />
        <input type="text" style="width: 100%; text-align: right;" ng-model="discrimination.value_addition" format="priceformat" placeholder="R$ 0,00" class="money" />
    </div>
    <div style="float: left; width: 20%; margin-right: 10px;">Desconto
        <br />
        <input type="text" style="width: 100%; text-align: right;" ng-model="discrimination.value_discount" format="priceformat" placeholder="R$ 0,00" class="money" />
        
       
    </div>
    
             <a ng-click="addDiscrimination()" style="float: left;" style="width: 5%;">
            +
        </a>
        
    
    <div style="clear: both;"></div>
    <div ng-repeat="obj in discriminations">
        <input type="text" style="width: 100%; text-align: right;" ng-model="obj.value" format="priceformat" placeholder="R$ 0,00" class="money" />
    </div>
    <br />
    <div>
        <table border="1">
            <thead>
                <tr role="row">
                    <th>VALOR</th>
                    <th>ADICIONAL</th>
                    <th>DESCONTO</th>
                    <th>TOTAL</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td style="text-align: right;">{{ discrimination.value }}</td>
                    <td style="text-align: right;">{{ discrimination.value_addition }}</td>
                    <td style="text-align: right;">{{ discrimination.value_discount }}</td>
            ...

JavaScript

var myApp = angular.module('myApp', []);


myApp.controller('PushController', function ($scope, $http) {

    $scope.discriminations = [];

    $scope.discrimination = {
        id: '',
        name: '',
        value: 'R$ 0,00',
        value_addition: 'R$ 0,00',
        value_discount: 'R$ 0,00'
    };

    			$scope.addDiscrimination = function() {
				var _length = $scope.discriminations.push({
                                                id: '', 
                                                value: 'R$ 0,00', 
                                                value_decimal: 0,
                                                value_addition: 'R$ 0,00', 
                                                value_addition_decimal: 0,
                                                value_discount: 'R$ 0,00', 
                                                value_discount_decimal: 0,
                                                observations: ''
				});
			};
    
    $scope.$watch('discrimination.id', function (value) {

        if (value != '') {

            alert(value);
            //     $scope.id_restaurant_menu = value;

        }
    });
});




// Angular
myApp.filter('priceformat', function () {
    var is_number = /[0-9]/;
    var prefix = 'R$ ';
    var suffix = '';
    var centsSeparator = ',';
    var thousandsSeparator = '.';
    var limit = false;
    var centsLimit = 2;
    var clearPrefix = false;
    var clearSufix = false;
    var allowNegative = false;
    var insertPlusSign = false;

    if (insertPlusSign) allowNegative = true;

    function to_numbers(str) {
        var formatted = '';
        for (var i = 0; i < (str.length); i++) {
            char_ = str.charAt(i);
            if (formatted.length == 0 && char_ == 0) char_ = false;
            if (char_ && char_.match(is_number)) {
                if (limit) {
                    if (formatted.length < limit) formatted = formatted + char_
                } else {
                   ...