JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<body ng-app="app" ng-controller="controlador">

<form ng-submit="submitForm()">
    <label>Nome: </label><input type="text" name="nome" ng-model="user.nome">
    <label>E-mail: </label><input type="text" name="email" ng-model="user.email">
    
    <input type="text" hidden name="email" ng-model="user.telefone">
    <input type="text" hidden name="email" ng-model="user.cpf">
    
    <input type="button" value="Adicionar" ng-click="addItem(user)" />
</form>
<br />

<div ng-repeat="item in items">
ID: {{item.soma}}<br />
Nome: {{item.nome}}<br />
E-mail: {{item.email}}<br /><br />
<!-- Trigger the modal with a button -->
<button type="button" class="btn btn-primary btn-xs" data-toggle="modal" data-target="#myModal" ng-click="addAtributos(item)">Atributos</button>
<hr />
</div>

<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Atributos</h4>
      </div>
      <div class="modal-body">
        <label>Telefone: </label><input type="text" name="telefone" ng-model="produtoTrib.telefone">
        <label>CPF: </label><input type="text" name="cpf" ng-model="produtoTrib.cpf">
        <label>Estado: </label>
        <select id="estado">
        	<option value="" selected="selected"></option>
        	<option value="GO">GO</option>
            <option value="TO">TO</option>
        </select><br /><br />
        <span style="display:none" id="insc-go"><label>Insc. GO:...

JavaScript

$(document).ready(function(e) {
		
		$('#estado').on('change', function() {
			if($(this).val() == "GO"){
				$('#insc-go').show();
				$('#insc-to').hide();
			}
			if($(this).val() == "TO"){
				$('#insc-to').show();
				$('#insc-go').hide();
			}
			if($(this).val() == ""){
				$('#insc-to').hide();
				$('#insc-go').hide();
			}
		  })
})

var app = angular.module('app', []);
    app.controller('controlador', function($scope, $http) {
	$scope.user = {};
	$scope.items = [];
	var sum = 1;
	
	$scope.addItem = function (user){
			$scope.items.push({
				nome: $("input[name='nome']").val(),
				email: $("input[name='email']").val(),
				soma: sum++
			});
		  user.nome = '';
		  user.email = '';	
	};
});