3

階層に従っていくつかの表形式のデータを表示する必要があります。たとえば、国とその人口、およびその地域がカバーする地域のリストと、その都市の一部です。近所などのより深いレベルにも行くことができます。

Place        Population    Area
---------------------------------
Canada      33,500,000     10,000,000
  Toronto    2,600,000         612
  Montreal   1,300,000         300
USA         317,000,000     9,800,000
  ...          ...             ...
  ...          ...             ...
     ...       ...             ...           
     ...       ...             ...

Angular と ngRepeat を使用して Tree テーブルを作成し、この階層を表示しようとしましたが、うまくいきません。ul および li タグを使用するBrendan Owen http://jsfiddle.net/brendanowen/uXbn6/8/のこの優れたソリューションも試しましたが、table および tr/td タグが使用されている場合は機能しません。テーブルでこれを達成することは可能ですか?

4

2 に答える 2

0

このプロジェクトは、良好なフォロー (435 以上のスター付き) を持つ優れた Angular ツリーを提供します。

https://github.com/nickperkinslondon/angular-bootstrap-nav-tree

ツリーのサンプルはこちらからご覧いただけます。 http://nickperkinslondon.github.io/angular-bootstrap-nav-tree/test/bs3_ng120_test_page.html

Angular 以外のオプションの場合、jquery treetable はかなり簡単な実装を提供します。

http://ludo.cubicphuse.nl/jquery-treetable/

各ノード (親、子、または後続の子) は、テーブル内の tr 要素である必要があり、独自の ID と親ノードの ID を指定する必要があります。

<table>
    <tr data-tt-id="1">
        <td>Parent</td>
    </tr>
    <tr data-tt-id="2" data-tt-parent-id="1">
        <td>Child</td>
    </tr>
</table>
于 2015-05-17T15:39:03.440 に答える
0

HTML テーブルを使用していませんが、angular dynamic-treeをチェックアウトしましたか?

消化するコードが少し少ないため、それを生み出したブログ投稿もチェックする価値があるかもしれません。

例を探している場合は、ここにjsFiddleがあります。あなたのhtmlは単に次のようになります：

<ui-tree
    ng-model="assets"
    load-fn="loadChildren"
    expand-to="hierarchy"
    selected-id="111"
    attr-node-id="assetId" />
于 2014-04-15T16:36:17.717 に答える