2016-12-27 1 views
-1

私は、Webアプリのフロントエンドに組織の階層構造を構築しようとしています。現在、Angular2を使用しています。Angular2を使ってUIを設計する

Details

これは、要約ビューでどのように見えるかです:

それは行うことができますどのように

Details 2

今私は次のパターンでやっています。 1.親グループ(ABC Company)をロードする 2.誰かがクリックすると、子組織は上記の方法でロードされます。

親グループが子グループの前に追加されているブラウザで戻るボタンをクリックしたときに、データを配列&に保存しようとしています。

答えて

0

これまでに何を試みましたか?かなり普通のセットアップのようです...アクティブなときに拡大表示で会社の詳細を表示するカスタムディレクティブに対してリピータ設定を行うことができます。

<div *ngFor="let company of companies" (click)="company.isActive = !company.isActive"> 
    <my-company-details *ngIf="company.isActive" companyData=company> 
</div> 
+2

初めてページが読み込まれるとき、私はABCの会社を読み込み、ABCの会社をクリックすると、私は子供のグループ、つまりPANインドを取得します。残りのグループのワークフローは同じです。いくつかのボタンが戻るボタンをクリックすると、親グループを取得する新しいapi呼び出しが発生します。その親グループは、その子グループのinfrontに追加されます。どのようにしてこのようなワークフローを回避できますか?現在、私はサーバーから受け取ったグループデータを格納するために配列を使用しています。グループのIDで配列内のグループをソートすることを考えました。しかし、私はstring_value( "e8t4hsi8097"のような)をgroup_idフィールドに入れています。 –

関連する問題