ui.Bootstrap.Collapse强制在Angular

Question

我有一个使用ui.bootstrap崩溃的表单，在选择它总是提交时，不知道为什么，这是我的代码：

HTML：

<form class="form-horizontal" role="form" ng-submit="update($event)">    
        <tabset>
            <tab heading="Restrictions">
                <div ng-controller="CollapseDemoCtrl">
                    <br />
                    <button class="btn btn-default" ng-click="isCollapsed = !isCollapsed">Departments <span class="glyphicon glyphicon-chevron-down"></span></button>
                    <div collapse="isCollapsed">
                        <div> Code to display departments </div>
                    </div>
                </div>
            </tab>
        </tabset>

        <br />
        <div>
            <input type="submit" class="btn btn-success" value="Save" />
            <button class="btn btn-warning" ng-click="cancel()">Cancel</button>
        </div>
    </div>
</form>

棱角JS：

angular.module('xTimeApp').controller('CollapseDemoCtrl', function ($scope) {
    $scope.isCollapsed = false;
});

$scope.update = function (event)
{
    var test = "Save my changes";
}

Answer 1

您可以使用表单，但只需添加type =＆＃34;按钮＆＃34;在ui-collapse的按钮上，否则它会弹出第一个按钮并认为它是一个提交按钮。

<form class="form-horizontal" role="form" ng-submit="update($event)">    
            <tabset>
                <tab heading="Restrictions">
                    <div ng-controller="CollapseDemoCtrl">
                        <br />
                        <button type="button" class="btn btn-default" ng-click="isCollapsed = !isCollapsed">Departments <span class="glyphicon glyphicon-chevron-down"></span></button>
                        <div collapse="isCollapsed">
                            <div> Code to display departments </div>
                        </div>
                    </div>
                </tab>
            </tabset>

            <br />
            <div>
                <input type="submit" class="btn btn-success" value="Save" />
                <button class="btn btn-warning" ng-click="cancel()">Cancel</button>
            </div>
        </div>
</form>