Html 模式在启动时错误打开

html页面中的模式视图中存在问题。每次我加载页面时都会发生这种情况。模式始终从html页面的底部开始。但每次加载只发生一次。我如何解决这个问题。我做错了什么。我们将不胜感激

这是我的html

<div class="form-group">
  <div class="col-lg-12 co-md-9">
    <div class="row">
      <table id="basic-datatables" class="table table-bordered table-hover" cellspacing="0" width="100">
        <thead style="text-align:match-parent">
          <tr>
            <th rowspan="1" colspan="1" style="width:100px">
              <a href="javascript:void(0)" class="table-links" ng-click="sortType='Name'; sortReverse=!sortReverse">
                <span ng-show="sortType != 'Name'" class="fa fa-unsorted"></span>
                <span ng-show="sortType == 'Name' && !sortReverse" class="fa fa-sort-asc"></span>
                <span ng-show="sortType == 'Name' && sortReverse" class="fa fa-sort-desc"></span> Customer Name
              </a>
            </th>
            <th rowspan="1" colspan="1" style="width:100px">Email</th>
            <th rowspan="1" colspan="1" style="width:100px">Mobile</th>
            <th rowspan="1" colspan="1" style="width:100px">Company</th>
            <th style="width:50px">Actions</th>
          </tr>
        </thead>
        <tbody>
          <tr ng-repeat="customer in filteredDetails = (customerDetails  | filter : Search | orderBy:sortType:sortReverse | limitTo: itemsPerPage: (currentPage - 1) * itemsPerPage)" style="text-align:match-parent">
            <td>{{customer.Name}}</td>
            <td>{{customer.Email}}</td>
            <td>{{customer.Telephone}}</td>
            <td>{{customer.Company}}</td>
            <td style="text-align:center">
              <a href="javascript:void(0)" class="btn btn-primary btn-alt btn-xs" type="button" ng-click="editDetails(customer)"><span class="glyphicon glyphicon-edit"></span></a>
              <a href="javascript:void(0)" class="btn btn-danger btn-alt btn-xs" type="button"><span class="glyphicon glyphicon-trash"></span></a>
            </td>
          </tr>
        </tbody>
      </table>
      <div ng-show="filteredDetails.length==0">
        No results found.
      </div>
      <div class="row">
        <div class="col-md-8 col-xs-12">
          <uib-pagination total-items="totalCustomers" ng-model="currentPage" ng-change="pageChanged()" max-size="maxSize" boundary-links="true" class="pagination" items-per-page="itemsPerPage"></uib-pagination>
        </div>
      </div>
      <!--Modal: edit-->
      <div id="cusEditModal" class="modal fade modal-style2 in" data-backdrop="static" data-keyboard="false" role="dialog" tabindex="-1" style="position:center" aria-labelledby="myModalLabel">
        <div class="modal-dialog modal-dialog-center" style="width:700px" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true" class="fa fa-times-circle-o"></span></button>
              <h4 class="modal-title"><i class="round round-lg grey"><span class="icons8-create-new s20"></span></i> Edit Customer Details</h4>
            </div>
            <div class="modal-body">
              <div class="form-group">
                <label class="col-lg-2 col-md-3 control-label" for="">Customer Id</label>
                <div class="col-lg-10 col-md-9">
                  <input type="text" class="form-control" name="cid" ng-model="modalEditDetails.Id" disabled />
                </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 col-md-3 control-label" for="">Name</label>
                <div class="col-lg-10 col-md-9">
                  <input type="text" class="form-control" name="cname" ng-model="modalEditDetails.Name" />
                </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 col-md-3 control-label" for="">Email</label>
                <div class="col-lg-10 col-md-9">
                  <input type="text" class="form-control" name="cemail" ng-model="modalEditDetails.Email" />
                </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 col-md-3 control-label" for="">Telephone</label>
                <div class="col-lg-10 col-md-9">
                  <input type="text" class="form-control" name="ctel" ng-model="modalEditDetails.Telephone" />
                </div>
              </div>
              <div class="form-group">
                <label class="col-lg-2 col-md-3 control-label" for="">Company</label>
                <div class="col-lg-10 col-md-9">
                  <input type="text" class="form-control" name="cid" ng-model="modalEditDetails.Company" />
                </div>
              </div>
            </div>
            <div class="modal-footer">
              <button class="btn btn-default mr5 mb10" data-dismiss="modal" type="button">Close</button>
              <button class="btn btn-warning mr5 mb10" type="button" ng-click="EditCustomer()">Edit</button>
            </div>
          </div>
        </div>
      </div>
      <!--Modal .End-->
    </div>
  </div>
</div>

---

把这个留在这里，以防对其他人有帮助

---

引导模态具有设置其打开动画的选项。在您的例子中，您有“淡入”和“淡入”类，它们启用了此选项。更改/删除其中任何一项都会有所帮助。这可能是因为js在插入DOM时没有正确计算模式高度，并且他们将其放置得太低。

将其保留在此处，以防对其他人有所帮助

---

引导模态具有设置其打开动画的选项。在您的例子中，您有“淡入”和“淡入”类，它们启用了此选项。更改/删除其中任何一项都会有所帮助。这可能是因为js在插入DOM时没有正确计算模式高度，并且他们将其放得太低。

发布您的

editDetails（customer）

函数。另外，请查看是否在

@diego.greyrobot中添加了函数：）@diego.greyrobot在
中删除
就可以解决问题。谢谢你的帮助。很高兴能帮上忙。添加它作为官方善意的回答。发布您的
editDetails（customer）
函数。另外，请查看是否在
@diego.greyrobot中添加了函数：）@diego.greyrobot在
中删除
，从而解决问题。谢谢你的帮助。很高兴能帮上忙。添加它作为官方善意的回答。
$scope.editDetails = function(details) {
    $scope.modalEditDetails = details;
    $("#cusEditModal").modal("show");
}
})();