7

Angular2 でファイル エクスプローラー アプリを実装しようとしています。

My Home コンポーネントには、フォルダーとファイルのリストが含まれます。リスト内のいくつかのフォルダーをクリックすると、クリックされたフォルダーの名前をクエリ文字列として使用して、別のコンポーネントに移動する必要があります。このコンポーネントには、さらに別のフォルダーとファイルのリストが含まれており、これはさらにネストされたレベルで続行できます。開いている各フォルダーのパスを URL バーに表示したい (つまり、./Folder1/Folder1.1/Folder1.1.2... など)。

Folder1
    Folder1.1
        Folder1.1.1
        Folder1.1.2
    Folder1.2
Folder2

コンポーネントはビューとルーターの両方として使用できないため、このほぼ無限のネスティングが許可されていないため、これを達成するのが難しいため、誰でもこれを達成するのを手伝ってくれますか?

4

1 に答える 1

2

クリックするたびに別のビューに移動する必要がある理由はありますか? ファイル システムのトラバーサルを表す何らかのタイプのブートストラップ ブレッドクラムで現在のビューを更新する方が簡単ではないでしょうか?

そうは言っても、あなたはいつでもこのようなことをすることができます。

@RouteConfig を使用してパスを設定します。

@RouteConfig([
    {path:'/', name:'Home', component:HomeComponent},
    {path:'/dir/:name', name:'Dir',component:DirComponent}
])

ディレクトリ名を URL パラメータとして渡す方法の例:

<a [routerLink]="['Dir',{name:'MyDirectory'}]">Profile</a>

次に、DirComponent のコンストラクター内で、そのパラメーターを取得できます。

constructor(private params: RouteParams) {

            let dirName = params.get('name');
}

基本的な概念は、メイン コンポーネントでディレクトリ名を渡し、それを URL パラメータとして別のルートに渡すことができるということです。

繰り返しになりますが、ディレクトリ トラバーサルごとに個別のルートが必要な理由を再考することをお勧めしますが、これにより、コンポーネント間で情報を渡すための 1 つのオプションが得られるはずです。

親/子コンポーネント間でデータを共有することも検討することをお勧めします。複数のコンポーネントで利用できるデータが必要な場合は、別のオプションになる可能性があります。

于 2016-02-25T22:08:24.733 に答える