Динамическое добавление полей полей в полях угловых js

Question

У меня есть форма, которая берет входные данные от пользователя для ресурса. Каждый ресурс имеет много разделов, и каждый раздел имеет много ссылок. Я добавил возможность для пользователя динамически добавлять поля раздела в форму, но я теряюсь, когда речь заходит о том, как динамически добавлять поля ссылок в каждый раздел.

Мой HTML в настоящее время выглядит следующим образом:

<div class="form-group" ng-repeat="section in sections"> 
     <input type='text', ng-model="newResourceForm.sections" name="" placeholder="Enter a section name"> 
     // ng-repeat over links here 
     <button ng-click="removeSection()" ng-show="$last" Remove section 
    <button type='button', ng-click="addSection()" Add another section> 

Функциональность, которая динамически добавлять разделы:

 $scope.sections = [{"id": 1}]; 
     $scope.addSection = function() { 
     var newSectionNo = $scope.sections.length+1; 
     $scope.sections.push({"id": newSectionNo}); 
     } 
     $scope.removeSection = function() { 
     var lastSection = $scope.sections.length-1; 
     $scope.sections.splice(lastSection); 
     } 

Моя мысль была, что мне нужно структурировать $ scope.sections так: $scope.sections = [{"id": 1, "links": [{"id": 1, "title": "", "url": ""}] Но я новичок в Angular и не совсем знаю, как найти текущий раздел и нажать еще одну ссылку на него.

Answer 1

Вы на правильном пути. Чтобы найти текущий раздел и нажать еще одну ссылку на него, вам нужно воспользоваться переменной, которую вы создали с помощью ng-repeat. В вашем случае это переменная section. Вы можете передать, что в функции так же, как это:

<div class="form-group" ng-repeat="section in sections"> 

     <button type='button', ng-click='addLink(section)'>Add Link</button> 

     <div ng-repeat='link in section.links'> 
      <!-- Links here --> 
     </div> 

</div> 

Новая функция AddLink вы бы создать в контроллере принимает раздел в качестве параметра, так что вы можете напрямую изменить его.