0

我有一个代表“讨论”或“辩论”的对象,它有两个孩子——每个孩子都是代表辩论中“争用”的孩子对象的集合。一个孩子是“肯定”争论的集合,另一个是“否定”争论的集合。

我正在使用这样的东西:

<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>

这将显示两组争用,每组顶部都有一个“添加新争用”表单。表单基于 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
    }
  };

一切都很好,除了:假设您打开“肯定”端的“添加新争用”表单。它将显示一个空白名称,并选择了单选按钮“肯定”。如果您然后单击“否定”侧的“添加新争用”按钮,将出现相应的表单,但两个“名称”字段都将被空白,并且两个单选按钮都将被选中用于“否定”。

$scope 应该在每一边都不同,不是吗?每个表单都使用自己的 $scope.edit 模型;为什么修改否定争用方的“edit.name”和“edit.aff”模型会影响肯定方的?

4

1 回答 1

1

根据我在提出这个问题后所学到的知识以及遵循 Mark Rajcok 的建议,这个问题的主要主旨是我正在嵌套 Scopes,这不是最佳实践。

就我而言,我所依赖的其他 $scope 变量需要在子范围内初始化,否则它们是从父范围继承的。这完全是我的目标,但它最终在我的实现中变得混乱,我错过了修复它。

然而,最重要的是:尽量不要嵌套范围!相反,使用自定义服务处理控制器之间的数据接口。

于 2013-04-09T04:13:11.217 回答