サードパーティの UI ライブラリ (Angular マテリアル) を Angular プロジェクトに導入する方法に関する簡単な説明

この記事では、サードパーティの UI ライブラリ (Angular マテリアル) を Angular プロジェクトに導入する方法を紹介します。一定の参考値があるので、困っている友達が参考になれば幸いです。

#環境:

Angular CLI: 11.0.6
• Angular: 11.0.7
• Node: 12.18.3
• npm : 6.14.6
• IDE: VSCode

1. サードパーティ UI の選択ライブラリ

Angular 開発では、単純なページが 1 つまたは 2 つしかない場合を除き、サードパーティの UI ライブラリを導入することが不可欠です。どのライブラリを使用するかについては、さまざまな側面を考慮する必要があります。 [関連チュートリアルの推奨事項:「

angular チュートリアル」]

例:

• 人気度

• バージョン更新状況 (定期的な更新がフォローアップできるかどうか、バグが修正されているかどうか)

• UI スタイル、プロジェクトに適しているかどうか

• 開始のしやすさ

• ドキュメントの完全性

市場には Angular 用のクラス ライブラリが多数提供されており、プロジェクトや企業の状況に応じて選択できます。オプションの UI ライブラリを簡単にリストします。

• Angular マテリアル: Angular の公式 UI ライブラリ。 https://material.angular.io/

• clarity: 比較的人気のある海外フレームワーク、https://clarity.design/。

• NG-ZORRO: Alibaba Ant Design の Angular バージョン。 https://ng.ant.design/docs/introduce/en

• Element Angular: 中国で非常に人気のある Vue ベースの Element には Angular バージョンもあります。 https://element-angular.faas.ele.me/

• 剣道 UI。多くは非常に強力ですが、料金が必要です。 https://www.telerik.com/kendo-angular-ui

2. Angular マテリアル

#2.1 。メリットとデメリット

2.1.1. メリット

公式 UI コンポーネント
• 最も標準的なマテリアル実装
• Angular コア コンポーネントの更新の進行状況を追跡する
• Angular との同時アップグレードの公式サポート

##2.1.2. 欠点

# コンポーネントの数は他のフレームワークに比べて多くありませんが、基本的には十分です。 #2.2. プロジェクトの概要

• 1. ルート ディレクトリで次のコマンドを実行します:

ng add @angular/material

2. ページが属するモジュールにインポートする、またはapp.module.ts に。

// import MatSliderModule
import { MatSliderModule } from '@angular/material/slider';

…
@NgModule ({....
  imports: [...,
  MatSliderModule,
…]
})

3. 概要

サードパーティ製コンポーネントには独自の長所と短所があります

同社によると、プロジェクトのニーズに応じて、

• を選択すると、Angular マテリアルのアップグレードが簡単になり、公式にサポートされます。

• プログラミング関連の知識について詳しくは、

  プログラミング ビデオ

  をご覧ください。 ！

以上がサードパーティの UI ライブラリ (Angular マテリアル) を Angular プロジェクトに導入する方法に関する簡単な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。