Angular Multiple Ng Repeats.

Each repeated object contains their own select options list.

by Yashwanth M

HTML

<div id='mainC' ng-app="angularjs-starter" ng-controller="MainCtrl">
   <fieldset ng-model='y' ng-repeat="choise in choices">
	<p> <ul>Id, Options
		<li ng-repeat="(k,v) in choise">{{v}}</li>
	</ul></p>
    
	<select id='myOptions'>
		<!-- https://stackoverflow.com/a/41386242/5081877" -->
         <option ng-model='x1' ng-repeat = "x in choise.options">{{x}}</option>
      </select>
   </fieldset>
   <button class="addfields" ng-click="addNewChoice()">Add fields</button>
</div>

CSS

.addfields {
    -webkit-appearance: button;
    cursor: pointer;
	  color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
  
}

JavaScript

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

  app.controller('MainCtrl', function($scope) {
  
  $scope.names = ['Mobile','Office','Home'];
  $scope.selectedValue = [];
  $scope.choices = [{id: 'choice1', options: $scope.names}];
  
  $scope.addNewChoice = function() {
    var newItemNo = $scope.choices.length+1;

	// https://code.angularjs.org/1.2.32/docs/api/ng/function/angular.element
	// https://stackoverflow.com/a/20690490/5081877
    // First Frame
    var ele = document.getElementById('myOptions');
	var angularEle = angular.element( ele );
    console.log( angularEle[0].value );
    
    var value = angularEle[0].value;
    $scope.selectedValue = $scope.names.filter(item => item !== value)
    console.log( $scope.selectedValue );

    $scope.choices.push({'id':'choice'+newItemNo, options: $scope.selectedValue});
  };
  
});