JSFiddle - React, Tailwind, and code Playground
HTML
<div ng-app ng-controller="phoneController">
<p ng-model="count" ng-init="count = 1">count: {{count}}</p><br>
<div id="phone1">phone 1: <input ng-model="phone1"></div>
<a ng-click="addPhone()" href='#'>Add Phone</a><br>
<a ng-click="listValues()" href='#'>List Phones</a>
<p ng-model="values">{{values}}</p>
</div>
JavaScript
function phoneController($scope) {
$scope.addPhone = function() {
var lastPhone = angular.element(document.getElementById('phone' + $scope.count));
$scope.count++;
lastPhone.after('<div id="phone' + $scope.count + '">phone ' + $scope.count + ': <input ng-model="phone' + $scope.count + '"></div>');
}
$scope.listValues = function() {
var phones = [];
var i;
for (i = 1; i <= $scope.count; i++) {
phones.push($scope["phone" + i]);
}
$scope.values = phones;
}
}