ng sq uiダウンロードng sq uiダウンロード

ng sq ui

サードパーティ製コンポーネント

Updated to angular 12.2.4 + bug fixes

ダウンロード

ng-sq-ui

Angular用のシンプル品質のUIキット

開発者のために開発者によって構築されました！

ドキュメント

各コンポーネントのパブリックAPIの説明があります。コンポーネントはモジュールによってグループ化されます。このドキュメントから除外されたコード検査を通じて確認できるプロパティは、内部使用のためであり、それらに依存してはいけません。

あらゆる種類の公開インターフェイスとサービスも含まれています。

ホームページ
インストール
formelementsmodule
モダルモジュール
ProgressBarmodule
DateTimePickermodule
DataTableModule
CommonModule
私たちについて
バウンティプログラム
ライブの例
トラブルシューティング

変化の破壊：

すべてのパッケージの2.0.1リラースは、Angular 14+と互換性があります。後方互換バージョンが必要な場合は、以下に示すように、1.xyパッケージを参照してください。

注記：
ビューエンジンを使用するプロジェクトについては、代わりにIVY（Angular 10〜Angular 12）を使用して、各パッケージに次のバージョンを使用してください。

@sq-ui/ng-sq-ui： 1.3.3
@sq-ui/ng-datetime-picker： 1.1.2
@sq-ui/ng-sq-common： 1.1.5
@sq-ui/ng-modal： 1.1.2
@sq-ui/ng-datatable： 1.1.3

Angularバージョン<9を使用するプロジェクトについては、各パッケージに次のバージョンを使用してください。

@sq-ui/ng-sq-ui： 1.1.5
@sq-ui/ng-datetime-picker： 1.1.0
@sq-ui/ng-sq-common： 1.0.3
@sq-ui/ng-modal： 1.0.6
@sq-ui/ng-datatable： 1.0.3

インストール

このレポンをクローン /ダウンロードするか、ノード依存関係としてインストールできます。

 npm i @sq-ui/ng-sq-ui@latest --save

- または -

 yarn add @sq-ui/ng-sq-ui@latest

使用法

モジュールにngsquimoduleをインポートします。

 import { NgSqUiModule } from '@sq-ui/ng-sq-ui';

そして、@ngmodule（）デコレーターのimports配列にそれを含めます。

 @NgModule({
  declarations: [ //... ],
  imports: [
    NgSqUiModule,
    //...
  ],
  //...

NG-SQ-UIには特定のフォントが付属していません。デフォルトのテーマを含めることもオプションです。ライブ例ページを参照してください。

グリッドが必要ですか？私たちはあなたをカバーしています！

angular.jsonにスタイルを追加します

 "styles" : [
  " src/styles.css " ,
  " ./node_modules/@sq-ui/ng-sq-common/sq-ui-theme.scss " ,
  " ./node_modules/@sq-ui/ng-sq-ui/styles/form-elements.scss " ,
  " ./node_modules/@fortawesome/fontawesome-free/css/fontawesome.min.css " ,
  " ./node_modules/@fortawesome/fontawesome-free/css/solid.min.css " ,
  " ./node_modules/@fortawesome/fontawesome-free/css/regular.min.css " ,
],

コンポーネントにスタイリングを適用します

スタイリングを使用するには、親要素にclass="sq"を追加するだけです。

 < body class =" sq " >
  < div class =" row " >
    < sq-input ... > </ sq-input >
  </ div >
</ body >

依存関係

ng-sq-uiは以下に依存します

font-awesome and inmutable.js（両方ともng-sq-uiでインストールされます）

地元で試してみてください

 git clone [email protected]:SQ-UI/ng-sq-ui.git
npm i
npm start

- または -

 git clone [email protected]:SQ-UI/ng-sq-ui.git
yarn install
npm start

npm startを実行すると、ライブラリは自動的に視聴されます。

このプロジェクトのタイプスクリプトコンパイラは、 dist/の下のライブラリを探すように構成されており、 dist/が存在しない場合、ライブラリのソースコードを指します。そのため、 ng serve --open npm start dist/ （存在する場合）を削除してからng serve --openを実行する代わりに、 npm startを実行する必要があります。これにより、コンパイラがprojects/ディレクトリに基づく変更をリッスンする準備をします。