динамического выбора окна в AngularJS с JQuery

Question

Ниже приводится мой PLNKR CODE

Проблема -

Я пытаюсь создать динамический вариант этикетки и textarea как -

1. Если пользователь выбирает " Затем нажмите «+», затем выберите « », который будет содержать [«Ячейка», «Главная», «Факс»]
2. И снова выбрав «Домой», со второго выбора и щелкая значок «+» , следующий выбор будет содержать только «Ячейки», «Факс»] и т. д.

Но я не могу сделать так, чтобы мой первый массив уменьшался, и никакие данные не поступают в более низких вариантах выбора.

Дайте мне знать, что я делаю неправильно, и как я могу это сделать (предложения тоже приветствуются).

Answer 1

В вашем $ scope.temp есть правильное количество объектов. Я думаю, проблема связана с тем, как вы создаете новые параметры выбора после нажатия кнопки «плюс». Вы пытаетесь построить элемент с помощью конструктора jQuery.

Вместо этого вам может потребоваться использовать специальную директиву.

Answer 2

Move ng-click к <a> и добавьте ng-model="target" в текстовое поле:

<select ng-model="contact" 
     ng-options="selOption.value as selOption.name for selOption in selOptions" 
     ng-init="contact = selOptions[0].value"></select> 
<textarea ng-model="target"></textarea> 
<a href="#" ng-click="shiftArr()"><img src="..." id="plusbutton"></a> 

В контроллере, инициализировать $scope.target и изменять $scope.shiftArr следующим образом:

$scope.target = ''; 

$scope.shiftArr = function() { 
    var arrVal = $scope.contact; 
    var newArr = []; 
    newArr = $scope.selOptions; 
    for (var i = 0; i < newArr.length; i++) { 
     if (newArr[i].value === arrVal) { 
      $scope.target = $scope.target + newArr[i].name + '\n'; 
      var index = arrVal - 1 ; 
      newArr.splice(index, 1); 
      $scope.temp = newArr; 
     } 
    } 
};