ngx slider

ผู้ขับขี่ NGX

ส่วนประกอบตัวเลื่อนที่ปรับแต่งได้สำหรับ Angular> = 9 ขึ้นอยู่กับ NG5-Slider

หากคุณกำลังมองหาการสนับสนุนเชิงมุมด้วยเวอร์ชัน <9 โปรดใช้แพ็คเกจต้นฉบับ: NG5-Slider

การติดตั้ง

เพื่อเพิ่มตัวเลื่อนในโครงการเชิงมุมของคุณ:

 npm install --save @m0t0r/ngx-slider

เมื่อติดตั้งแล้วเพิ่มตัวเลื่อนลงใน app.module.ts :

 import { NgxSliderModule } from '@m0t0r/ngx-slider' ;

...

@ NgModule ( {
   ...
   imports : [
     ...
     NgxSliderModule ,
    ...
   ] ,
   ...
} )
export class AppModule { } 

ตัวอย่างการใช้งาน

ตอนนี้คุณสามารถใช้องค์ประกอบตัวเลื่อนในส่วนประกอบแอปของคุณได้เช่นใน app.component.ts :

 import { Options } from '@m0t0r/ngx-slider' ;
...

@ Component ( { ... } )
export class AppComponent {
  value : number = 100 ;
  options : Options = {
    floor : 0 ,
    ceil : 200
  } ;
}

และในไฟล์เทมเพลต app.component.html :

 < ngx-slider [(value)] =" value " [options] =" options " > </ ngx-slider > 

การจัดแต่งทรงผม

ภาพรวมของวิธีการใช้สไตล์ของคุณเองกับตัวเลื่อนอธิบายไว้ใน styling.md

ภาพเคลื่อนไหว

Verion ปัจจุบันของ Slider มีแอนิเมชั่น CSS ของการเคลื่อนไหวของตัวเลื่อน หากคุณต้องการพฤติกรรมก่อนหน้านี้โดยไม่มีภาพเคลื่อนไหวคุณสามารถตั้งค่า animate: false ในตัวเลือกตัวเลื่อนของคุณ

คำแนะนำเครื่องมือ

ตัวเลื่อนช่วยให้สามารถปรับแต่งวิธีการใช้คำแนะนำเครื่องมือ ดู Tooltips.md สำหรับข้อมูลเพิ่มเติม

ปัญหาที่รู้จัก

ก่อนที่จะรายงานข้อผิดพลาดใหม่โปรดดูที่ _issues.md สำหรับรายการปัญหาที่ทราบและวิธีแก้ปัญหาของพวกเขา รายงานข้อบกพร่องใหม่สำหรับปัญหาเหล่านี้จะไม่ได้รับการยอมรับ

ข้อมูลนักพัฒนา

หากคุณต้องการมีส่วนร่วมในโครงการดูนักพัฒนา

คำเตือน

เนื่องจากขาดการสนับสนุนแพ็คเกจดั้งเดิม (NG5-Slider) จึงได้รับการสนับสนุนจากการเพิ่มการสนับสนุน Angular 9+ ความตั้งใจของแพ็คเกจนี้คือการสนับสนุน Angular เวอร์ชันใหม่ (9+) หากคุณกำลังมองหาการสนับสนุนเวอร์ชันเชิงมุม <9 โปรดใช้ NG5-Slider

ใบอนุญาต

ใบอนุญาต MIT