Question

我在AngularJS中有一个ng-table。

<table ng-table="fondiTable" class="table table-condensed table-bordered table-striped" show-filter="isFiltersVisible">
        <tr ng-repeat="fondo in data | filter:getChiave | filter:getRapporto">  
            <td class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown"><i class="glyphicon glyphicon-th-list"></i></a>
                    <ul class="dropdown-menu">
                        <li><a><i class="glyphicon glyphicon-search"></i> Visualizza</a></li>
                        <li><a><i class="glyphicon glyphicon-pencil"></i> Modifica</a></li>
                        <li class="disabled"><a><i class="glyphicon glyphicon-trash"></i> Cancella</a></li>
                    </ul>
            </td>
            <td class="i9font text-center" data-title="'Data Rif'" header-class="'i9header'" filter="{dataRif: 'text'}" sortable="'dataRif'">{{fondo.dataRif}}</td>
            <td class="i9fontPre text-center" data-title="'Chiave IB'" header-class="'i9header'" filter="{chiave: 'text'}" sortable="'chiave'">{{fondo.chiave}}</td>    
            <td class="i9font text-center" data-title="'Stato Pratica'" header-class="'i9header'" filter="{stato: 'text'}" sortable="'stato'">{{fondo.stato}}</td>
            <td class="i9font text-center" data-title="'Flag S/V'" header-class="'i9header'" filter="{fvs: 'text'}" sortable="'fvs'">{{fondo.fvs}}</td>
            <td class="i9font text-right" data-title="'Fondo bucket 1 (EUR)'" header-class="'i9header'" filter="{fnd1: 'text'}" sortable="'fnd1'">{{fondo.fnd1}}</td>
            <td class="i9font text-right" data-title="'Fondo bucket 2 (EUR)'" header-class="'i9header'" filter="{fnd2: 'text'}" sortable="'fnd2'">{{fondo.fnd2}}</td>
            <td class="i9font text-center" data-title="'Bucket DH'" header-class="'i9header'" filter="{bktDH: 'text'}" >{{fondo.bktDH}}</td>
            <td class="i9font text-center" data-title="'Fondo DH bucket 1'" header-class="'i9header'" filter="{fnd1DH: 'text'}" >{{fondo.fnd1DH}}</td>
            <td class="i9font text-center" data-title="'Fondo DH bucket 2'" header-class="'i9header'" filter="{fnd2DH: 'text'}" >{{fondo.fnd2DH}}</td>
            <td class="i9font text-center" data-title="'Rapporto'" header-class="'i9header'" filter="{rapporto: 'text'}" sortable="'rapporto'">{{fondo.rapporto}}</td>
            <td class="i9font text-center" data-title="'Cdg'" header-class="'i9header'" filter="{cdg: 'text'}" sortable="'cdg'">{{fondo.cdg}}</td>
            <td class="i9font text-center" data-title="'Matricola ins'" header-class="'i9header'" filter="{insMatr: 'text'}" sortable="'insMatr'">{{fondo.insMatr}}</td>
        </tr>
    </table>

我只想从该表中选择一行，只需单击它就可以显示该行的数据，不仅是我在表中显示的那些行，还有其他引用到我所选行的行。简而言之，我需要单击一行来显示该选择的详细信息。我该怎么办？

Answer 1

您可以将ng-click绑定到表格行，例如

<tr ng-repeat="fondo in data | filter:getChiave | filter:getRapporto" ng-click="processData(fondo)"> 
</tr>

因此，点击每一行，您将获得控制器中的相应数据。

.controller('myCntrl',function($scope){
            $scope.processData=function(data){
                console.log(data)
            }

        });

单击ng-table中的一个特定行并加载该行的数据

1 个答案: