如何使用ng-switch(angularjs)添加许多字段



我有两个嵌套的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

问题是您在指令中使用$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: ''
  });
};

演示普伦克

相关内容

  • 没有找到相关文章

最新更新