JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="angularjs-starter" ng-controller="MainCtrl">
   <fieldset  data-ng-repeat="choice in choicesA">
      <input type="text" ng-model="choice.name" name="" placeholder="Enter name">
         <button class="addfields" ng-click="addNewChoice()">Add fields</button>
      <button class="remove" ng-click="removeChoice()">-</button>
   </fieldset>

       
   <div id="choicesDisplay">
      {{ choicesA }} <br/>
      {{ choicesB }}
   </div>
</div>

CSS

fieldset{
    background: #FCFCFC;
    padding: 16px;
    border: 1px solid #D5D5D5;
}
.addfields{
    margin: 10px 0;
}

#choicesDisplay {
    padding: 10px;
    background: rgb(227, 250, 227);
    border: 1px solid rgb(171, 239, 171);
    color: rgb(9, 56, 9);
}
.remove{
    background: #C76868;
    color: #FFF;
    font-weight: bold;
    font-size: 21px;
    border: 0;
    cursor: pointer;
    display: inline-block;
    padding: 4px 9px;
    vertical-align: top;
    line-height: 100%;   
}
input[type="text"],
select{
    padding:5px;
}

JavaScript

var app = angular.module('angularjs-starter', []);

  app.controller('MainCtrl', function($scope) {

  $scope.choicesA = [{id: 'choice1'}, {id: 'choice2'}];
  
  $scope.choicesB = [];
  
  $scope.addNewChoice = function() {
    var newItemNo = $scope.choicesA.length+1;
    $scope.choicesA.push({'id':'choice'+newItemNo});
  };
    
  $scope.removeChoice = function() {
    var lastItem = $scope.choicesA.length-1;
    $scope.choicesA.splice(lastItem);
  };
  
});