angular9 - Angular マテリアルのマテリアルテーマを動的に変更する

私は Angular を初めて使用しており、Angular マテリアル テーマを動的に変更したいと考えていました。scss ファイルを作成し、3 色を定義し、マット プロパティと関数を含めることで別のテーマを作成する方法は知っていますが、そのファイル参照を追加していました。 angular.json で静的に保存しますが、カスタムの Angular マテリアル テーマが多数ある場合は、CSS ファイルを動的に参照したいと考えています。

それでは、それを行うための簡単で迅速かつかなり最適化された方法はありますか?

追伸、多くの投稿やドキュメントを読んできましたが、たとえばテーマを動的に変更する場合、デフォルトのスタイルではなく別のスタイルを参照する方法など、順序が混乱しているようです。

どんな答えでも大歓迎です..!!

------------------------

解決策の 1 つは、マテリアル カラー パレットをリアルタイムで構築することです。必要な手順は次のとおりです。

CSS 変数でカラー パレットを定義し、それにアクセスします。 これらの変数をマテリアルの Angular テーマに割り当てます。 「tinycolor」を使用するライブラリを生成するサービスを作成します。 色をベースにしたパレット。 JavaScript を使用して、DOM 内の CSS 変数を更新します。

ここに例があります:

https://stackblitz.com/edit/angular-material-theming-playground

2

Angular でソリューションを実装すると、実行時に app-component.ts が「tinycolor が定義されていない」というメッセージを表示します。私に何が欠けているのでしょうか?

– user3859651

2021 年 5 月 7 日 10:31

9

NoSuchMethodError を受け取りました: メソッドが見つかりません: 'write$1'スタックブリッツの null で

– h11

2022 年 4 月 11 日 12:47