如何使用ng-switch（angularjs）添加多個字段

Question

我有兩個嵌套的ng-repeat，我想多次添加相同的表格MiseEnContext，在這個「MiseEncontext」中我想添加一些輸入，但當我添加文本它被添加爲我的所有MiseEnContext 問題： 如何隔離我的MiseEncontext？

'<h4>Exercice Redactionnel</h4>\ 
        <ul>\ 
         <li><a ng-click="addMiseEnContext()">Mise en context</a></li>\ 
         <li><a ng-click="addQuestion()">Question</a></li>\ 
        </ul>\ 
        <div ng-repeat="exRedContent in exRedContents">\ 
         <div ng-switch on={{exRedContentType}}>\ 
          <div ng-switch-when="1">\ 
           <h5>Mise en context</h5>\ 
            Titre<input type="text" /><br />\ 
             <button ng-click="addTexte(1)">addText</button>\ 
            <div ng-repeat="MecField in MecFields">\ 
             <div ng-switch on={{fieldsType}}>\ 
               <div ng-switch-when="1">\ 
              Text<input type="text">\ 
             </div>\ 
              <div ng-switch-when="2">\ 
                <h5>Text illustré</h5></ br>\ 
                Position: <input type="radio" name="group1" value="droit" checked>Text à droite<br />\ 
              </div>\ 
            </div>\ 
          </div>\ 
          </div>\ 
         <div ng-switch-when="2">\ 
           <h5>Question</h5>\ 
          </div>\ 
        </div>\ 
        </div>' 

演示：http://plnkr.co/edit/Cr0WN4hCuKTYJOfb5CBf?p=preview

Answer 1

您的問題是，你正在使用$scope.MecFields的份額能夠$scope變量在你的指令。我希望通過爲該對象添加索引來使其分開，以便它將成爲每個ng-repeat元素的唯一/獨立陣列。數組內容將取決於那裏索引。

標記

<button ng-click="addTexte($index)">addText</button>\ 
<div ng-repeat="MecField in MecFields[$index]">\ 
    <div ng-switch on={{fieldsType}}>\ 
     <div ng-switch-when="1">\ Text 
      <input type="text">\ 
     </div>\ 
     <div ng-switch-when="2">\ 
      <h5>Text illustré</h5></ br>\ Position: 
      <input type="radio" name="group1" value="droit" checked>Text à droite 
      <br />\ 
     </div>\ 
    </div>\ 
</div>\ 

代碼

$scope.addTexte = function(index) { 
    $scope.fieldsType = $scope.types[0].id; 
    if (!$scope.MecFields[index]) $scope.MecFields[index] = []; 
    $scope.MecFields[index].push({ 
    field: '', 
    value: '' 
    }); 
}; 

Demo Plunkr