Question

首先，我想为我糟糕的英语道歉：）

当我想从datagrid加载模态时，我遇到了AngularJS的问题。

这是我的网格代码：

<tr ng-repeat="data in filtered = (list | filter:search | orderBy : predicate :reverse) | startFrom:(currentPage-1)*entryLimit | limitTo:entryLimit track by $index">
                    <td>{{data.lastName}} {{data.firstName}}</td>
                    <td>{{data.email}}</td>
                    <td>{{data.phoneNumber}}</td>
                    <td>{{data.cityID}}</td>
                    <td><button class="btn btn-primary btn-xs" ng-click="show(data.id)">DETAILS</button></td>

模态代码：

<div class="modal-dialog">
<div class="modal-content">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
    <h4 class="modal-title"><strong>{{row.firstName}} {{row.lastName}}</strong> Details</h4>
  </div>
  <div class="modal-body">
    <table class="table table-condensed table-hover info-table">
      <tbody>
        <tr>
          <td>Email:</td>
          <td>{{row.email}}</td>
        </tr>
     </tbody>
    </table>
  </div>
</div>

和JS代码：

$scope.show = function (id) { 
    $http.get('inc/getDetails.php?id='+id).
    success(function(data) {
      $scope.row = data;
      $('#det-modal').modal('show');

    });

};

模态正在加载，但不加载数据。

Answer 1

代码不起作用，因为当在非角度世界中调用模态时，行变量超出范围。

您不应直接在控制器中访问DOM元素，因此不应在角度世界中使用以下行。

 $('#det-modal').modal('show');

要解决此问题，请考虑使用https://angular-ui.github.io/bootstrap/，这样您就可以将行作为范围变量传入。

数据没有在AngularJS中显示

1 个答案: