數據不AngularJS顯示

首先我要爲我的英語不好道歉:)數據不AngularJS顯示

我有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'); 

    }); 

};

模式正在加載，但不加載數據。

來源

2015-09-23 Milos N. Petrovic

強烈建議擺脫'bootstrap.js'並切換到'angular-ui-bootstrap' – charlietfl

您是否檢查過響應中的數據？在瀏覽器開發人員控制檯中的「$ scope.row = data;」放置一個斷點行，並查看數據是否符合您期望的格式（它必須是格式爲{firstName：「Name」，lastName：「LastName」，email：「email @ .... com」的對象}） –

While在控制器中調用jquery不是使用angularjs的正確方法，我認爲這不是問題的原因。一個JsFiddle在這裏https://jsfiddle.net/8wf17mmg/顯示它的工作原理，即使不是「概念上」正確的。 –

該代碼不起作用，因爲行變量超出了範圍，當模態在無棱角的世界中被調用時。

您不應該直接在控制器中訪問DOM元素，所以下面這行不應該用在角度世界中。

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

要解決該問題，可以考慮使用https://angular-ui.github.io/bootstrap/這將使你的行作爲一個範圍變量傳遞。

來源

2015-09-23 22:09:12 Abhi

感謝您的回答，我會嘗試這種方式...只是爲了確保如何:) –

https：//angular-ui.github。io/bootstrap /＃/ modal是模式示例 – Abhi

數據不AngularJS顯示

回答

相關問題