Javascript 角度脚只能显示选定的列数据

Javascript 角度脚只能显示选定的列数据,javascript,jquery,angularjs,Javascript,Jquery,Angularjs,我想知道Footable中是否有一种方法可以只显示您选择的一个的数据列,而隐藏其他列 例如,假设下面是相册列表(我的footable中的行) 如果我选择相册1,它的数据如下所示: album-name-1 track1 track2 track3 album-name-2 album-name-3 album-name-1 album-name-2 track1 track2 track3 album-name-3 如果选择album2,则仅显示这些详细信息,并且Album1中以前扩展的

我想知道Footable中是否有一种方法可以只显示您选择的一个的数据列,而隐藏其他列

例如,假设下面是相册列表(我的footable中的行)

如果我选择相册1,它的数据如下所示:

album-name-1

track1
track2
track3
album-name-2
album-name-3
album-name-1
album-name-2

track1
track2
track3
album-name-3
如果选择album2,则仅显示这些详细信息,并且Album1中以前扩展的曲目将按如下方式折叠:

album-name-1

track1
track2
track3
album-name-2
album-name-3
album-name-1
album-name-2

track1
track2
track3
album-name-3
我使用angularJS来使用footable。对如何实现这一目标有何建议?就像我知道的,如果我没有使用Footable这样的花哨东西,我可以通过使用ng click触发一个click事件来实现这一点,并传递索引以仅显示/隐藏我需要的内容。正如我之前问过的这个答案:

但是在这里,我尝试使用Footable插件。以下是我的html代码片段:

<table class="footable table table-stripped toggle-arrow-tiny" data-page-size="8">
                    <thead>
                    <tr>
                        <th data-toggle="all">Release Title</th>
                        <th data-toggle="all">Release Genre</th>
                        <th data-toggle="all">Classical</th>
                        <th data-hide="all">Tracks</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr ng-repeat="album in vm.albums" footable>
                        <td ng-click="vm.editAlbum(album, $index)">{{album.data.title}}</small></td>
                        <td>{{album.data.genre}}</td>
                        <td ng-if!="album.data.classical">No</td>
                        <td ng-if="album.data.classical">Yes</td>
                        <td><br>
                            <li ng-repeat="track in album.data.tracks">
                                <a ng-click="vm.selectTrack(album, track)">{{track.title}}</a>
                            </li>
                        </td>
                    </tr>
                    </tbody>
                    <tfoot>
                    <tr>
                        <td colspan="5">
                            <ul class="pagination pull-right"></ul>
                        </td>
                    </tr>
                    </tfoot>
</table>

发行名称
发行类型
古典的
轨道
{{album.data.title}
{{album.data.genre}
不
对

  • {{track.title}