web-dev-qa-db-ja.com

Angular 6?

私はマルチレベルのサイドナブを達成しようとしましたが、私の要件を満たすこれを見つけました:

角度材料マルチレベルメニュー

デモ -アコーディオンの種類に注意してください

残念ながら、これはAngularJS(1.0?)用に作成されており、Angular 6では機能しないようです。

私の質問は:

  1. Angular 6の他のマルチレベルsidenavコンポーネントはありますか?Googleで同様に機能するものを見つけました。
  2. このAngular 1.0メニューをAngular 6?どうやって?
  3. 独自のマルチレベルサイドナビゲーションを作成するための簡単な指示やコースはありますか? 1レベルについては多くの指示がありますが、マルチレベルは見つかりませんでした。
5
sibert

あなたがまだ角質材料マルチレベルメニューを探しているかどうかはわかりませんが、シャンキーティワリ製のものを見つけました。 GitHub のリンクと demo のリンクを次に示します。

非常に使いやすく、実装が簡単です。たとえば、Angular material。では存在しないため、サイドバーで実装しました。

7
PierBJX

Angular Material 6.0には、すぐに使用できるマルチレベルメニューはありません。自分で作成する必要があります。 ネストメニューサイドナビゲーション の組み合わせになります。

最初の質問に答えるために、 PrimeNGのパネルメニュー をご覧になることをお勧めします。それはあなたが必要とするものを正確に行い、少しの努力で、デザインをマテリアルのようなものに変更することもできます。 (私はいくつかのPrimeNGコンポーネントでそれを行ったので、動作することを確認できます。

PrimeNG 6.0.0が現在 Alpha-2バージョン にあることを考慮してください。

3
Dino

Demo

ソリューションの一部を見つけました。

「mat-expansion-panel」を使用したデモ

まだ解決しなければならない問題がいくつかあります。

  1. 拡張レベルの影とオフセット
  2. 選択されたままではなくシャットダウン
  3. これを行うより良い方法は?

助言がありますか?

2
sibert