ng spinners 다운로드 - ng spinners 소스 코드 다운로드

ng spinners

타사 구성 요소

Size property in circle and ring loaders

다운로드

Angular Spinners CSS 로더 (Vue, React)

순수한 CSS를 갖춘 Angular Spinners 구성 요소의 놀라운 컬렉션.
Angular Spinner는 Loading.io와 웹 전체의 모든 것을 기반으로합니다.

추가 CSS 수입이 없습니다
✂️ 제로 종속성
? 스피너는 별도로 설치할 수 있습니다

라이브 데모

구성 요소를 탐색하고 비트로 소품을 탐색하십시오.
전체 프로젝트를 설치하지 않고도 NPM, 원사 또는 비트로 특정 Angular Spinner 구성 요소를 설치하십시오.
구성 요소 및 라이브 데모를 설치하십시오

스피너 목록 - 입력 및 기본 속성

각 구성 요소는 color 소품을 허용하며 size 도 소품을 수용하는 사람은 거의 없습니다.
기본 color 소품은 #7f58af 입니다.
size 소품을 허용하는 구성 요소는 픽셀의 기본 크기가 있습니다.

스피너	색상 : 문자열	크기 : 숫자
`<circle-loader></circle-loader>`	`#7f58af`	`64`
`<default-loader></default-loader>`	`#7f58af`	-
`<dualring-loader></dualring-loader>`	`#7f58af`	-
`<ellipsis-loader></ellipsis-loader>`	`#7f58af`	-
`<facebook-loader></facebook-loader>`	`#7f58af`	-
`<grid-loader></grid-loader>`	`#7f58af`	-
`<heart-loader></heart-loader>`	`#7f58af`	-
`<hourglass-loader></hourglass-loader>`	`#7f58af`	-
`<ring-loader></ring-loader>`	`#7f58af`	`80`
`<ripple-loader></ripple-loader>`	`#7f58af`	-
`<roller-loader></roller-loader>`	`#7f58af`	-
`<spinner-loader></spinner-loader>`	`#7f58af`	-
`<orbitals-loader></orbitals-loader>`	`#7f58af`	-

? 설치

NPM을 사용하여 NG 스피너를 설치합니다

 npm i --save ng-spinners

비트로 각도를 위해 스피너를 재생하고 설치하십시오

비트, NPM 또는 원사로 특정 Angular Spinner 구성 요소/모듈을 설치하여 Bit을 사용하여 Live Demo를 사용하여 전체 프로젝트를 설치하지 않고 설치하기 전에 스피너를 사용해보십시오.

NPM Regisetry Config 설정 (일회성 조치) :

npm config set ' @bit:registry ' https://node.bit.dev

좋아하는 패키지 관리자를 사용하십시오.

npm i @bit/joshk.ng-spinners.facebook-loader
yarn add @bit/joshk.ng-spinners.facebook-loader
bit import joshk.ng-spinners/facebook-loader

사용 예제

모듈 파일 예 :

 import { BrowserModule } from '@angular/platform-browser' ;
import { NgModule } from '@angular/core' ;

import { AppComponent } from './app.component' ;
//using npm or yarn
import { FacebookLoaderModule } from 'ng-spinners' ;
//using bit
import { FacebookLoaderModule } from '@bit/joshk.ng-spinners.facebook-loader' ;

@ NgModule ( {
	declarations : [
		AppComponent ,
	] ,
	imports : [
		BrowserModule ,
		FacebookLoaderModule
	] ,
	providers : [ ] ,
	bootstrap : [ AppComponent ]
} )
export class AppModule { }

구성 요소 HTML 파일 예 :

 < facebook-loader color =" black " > </ facebook-loader >
< facebook-loader color =" #de3541 " > </ facebook-loader >
< facebook-loader > </ facebook-loader >