javascript - 在 ng-repeat 上删除 AngularUI Accordion

Question

所以我正在尝试向我的 ng-repeating Accordion 添加删除功能。显示了按钮并设置了功能，但是当按下删除按钮时，页面几乎重新加载然后重定向到 localhost:8080/# 但是它不应该重定向到这里，并且没有任何建议它应该重定向到这里，无论如何我都看不到，也许这是问题之一？但是我看不出这是否源自..

由于应用程序在页面刷新后尚未托管，所有数据都将丢失，因为它被传递到当前编辑 View ，由它之前的 View 显示在表格中，直到您单击其中一行并被带到所述编辑页面。

这是我的 JS 删除函数:

  $scope.delete = function (index, event) {
    if(event) {
        event.preventDefault();
        event.stopPropagation();    
    }

    $scope.selectedTestScript.Actions.splice(index, 1);
  } 

这是我的 ng-repeat Accordion :

<uib-accordion close-others="oneAtATime">
    <uib-accordion-group ng-repeat="action in selectedTestScript.Actions" is-open="action.isOpen" ng-click="action.isOpen=!action.isOpen">
          <uib-accordion-heading>
              <div>{{action.Description}}<button type="button" class="btn btn-xs btn-danger pull-right" ng-click="delete($index, event)"></i>Delete</button></div>
          </uib-accordion-heading>
          <div>
            <label for="actionNotes" class="control-label col-xs-2">Action Notes</label>
            <div class="col-xs-10">
              <textarea id="actionNotes" type="text" rows="4"ng-model="action.Notes" class="form-control" name="name"></textarea> 
            </div>
          </div>
          <div>
            <label for="actionExpected" class="control-label col-xs-2">Action Expected</label>
            <div class="col-xs-10">
              <input id="actionExpected" type="text" ng-model="action.ExpectedOutcome" class="form-control" name="name">
            </div>
          </div>                  
    </uib-accordion-group>
</uib-accordion>

任何帮助将不胜感激，我已经尝试简化函数并删除 if(event) 语句并将其保留为拼接，但这也不起作用。

提前致谢。

Answer 1

我猜你有一个围绕你发布的代码的表格？如果是这种情况，请使用 <button>没有type指定默认为 type=submit ，它会触发原始 HTML 表单提交，从而导致重定向。

可以设置type至 button以防止这种情况发生。

还有 action.isOpen==!action.isOpen看起来不对，你是说单例= ？

---

编辑:ui-bootstrap accordion下其实有一段上面写着

Known issues

To use clickable elements within the accordion, you have to override the accordion-group template to use div elements instead of anchor elements, and add cursor: pointer in your CSS. This is due to browsers interpreting anchor elements as the target of any click event, which triggers routing when certain elements such as buttons are nested inside the anchor element.

http://angular-ui.github.io/bootstrap/#/accordion