0

2 つの子を持つ「ディスカッション」または「ディベート」を表すオブジェクトがあります。各子は、ディベートの「競合」を表す子オブジェクトのコレクションです。1 つの子は「肯定的な」主張の集まりであり、もう 1 つは「否定的な」主張の集まりです。

私はこのようなものを使用しています:

<div ng-controller="contentionGroupCtrl" ng-repeat="(contentionType, contentionGroup) in debate.contentions_sorted" class="contention {[{contentionType}]}-section">
  <a class="button contention-new" ng-click="toggleEditForm()">+ Add New Contention</a>
  <div class="contention-new" ng-show="editing">
    <form ng-submit="formContentionSubmit()" class="ng-scope ng-pristine ng-invalid ng-invalid-required">
      <input type="text" id="contention_name" name="contention[name]" required="required" ng-model="edit.name" placeholder="New Contention" class="ng-pristine ng-invalid ng-invalid-required">
      <div>
        <input type="radio" id="contention_aff_0" name="contention[aff]" required="required" ng-model="edit.aff" value="1">
        <label for="contention_aff_0" class="required">Affirmative</label>
        <input type="radio" id="contention_aff_1" name="contention[aff]" required="required" ng-model="edit.aff" value="0">
        <label for="contention_aff_1" class="required">Negative</label>
      </div>
      <input type="button" ng-click="toggleEditForm()" value="Cancel">
      <input type="submit" value="Save">
    </form>
  </div>
  <div ng-controller="contentionCtrl" ng-repeat="contention in contentionGroup" class="contention" id="contention-{[{ contention.id }]}">
    EACH CONTENTION CONTENT STUFF HERE
  </div>
</div>

これにより、2 つの競合セットが表示され、それぞれの上部に [新規競合の追加] フォームがあります。フォームは、toggleEditForm() メソッドに基づいて切り替えられます。「新しい競合」と「競合の編集」に同じフォーム テンプレートを使用しているため、そのフォームには競合が「肯定的」か「否定的」かのモデル (ラジオ ボタン) があります。

コントローラー「contentionGroupCtrl」は競合のグループ用であり、その toggleEditForm メソッドは次のようになります。

// Toggle New Contention Form
  $scope.toggleEditForm = function() {
    var ct;
    $scope.editing = !$scope.editing; // First display or hide the form
    if ($scope.editing == true) {  // If displaying the form, initialize 
      if ($scope.contentionType == 'aff') {
        ct = 1; // 'aff' equates to 1 in the model
      }
      else {
        ct = 0;
      }
      $scope.edit.aff = ct; // Sets the radio button appropriately

      // We are now editing
      $scope.edit.name = ''; // Blanks out the contention "Name" field for creating a new contention
    }
  };

「肯定」側の「新しい競合の追加」フォームを開いたとしましょう。ラジオボタン「肯定」が選択された状態で、空白の名前が表示されます。次に、[Negative] 側の [Add New Contention] ボタンをクリックすると、適切なフォームが表示されますが、両方の [Name] フィールドが空白になり、両方の [Negative] のラジオ ボタンが選択されます。

$scope はそれぞれの側で異なるはずですよね? 各フォームは独自の $scope.edit モデルを使用します。否定的な競合側の「edit.name」および「edit.aff」モデルを変更すると、肯定的な側に影響するのはなぜですか?

4

1 に答える 1