ngx mask

หน้ากาก NGX

หน้ากาก NGX เป็นคำสั่งที่ดีที่สุดในการแก้ปัญหาการปิดบังด้วยรูปแบบที่จำเป็น

คุณยังสามารถลองตรวจสอบตัวบ่งชี้ NGX Loader ของเรา คุณยังสามารถลองตรวจสอบ NGX copypaste ของเรา

คุณสามารถลองใช้เอกสารสดพร้อมตัวอย่าง

การติดตั้ง

Angular Version 17.xx

$ npm install --save ngx-mask

Angular เวอร์ชัน 16.xx

$ npm install --save [email protected]

Angular เวอร์ชัน 15.xx

$ npm install --save [email protected]

Angular Version 14.xx

$ npm install --save [email protected]

Angular Version 13.xx หรือ 12.xx

$ npm install --save [email protected]

QuickStart ถ้า NGX-MASK เวอร์ชัน> = 15.0.0

นำเข้า NGX-MASK Directive, ท่อและให้ฟังก์ชันผู้ให้บริการ NGXMASK ด้วยฟังก์ชั่น provideNgxMask

ด้วยระดับแอปพลิเคชันตัวเลือกการกำหนดค่าเริ่มต้น

 bootstrapApplication ( AppComponent , {
    providers : [
        ( ... )
        provideEnvironmentNgxMask ( ) ,
        ( ... )
    ] ,
} ) . catch ( ( err ) => console . error ( err ) ) ;

ผ่านตัวเลือกการกำหนดค่าหน้ากากของคุณเอง

 import { NgxMaskConfig } from 'ngx-mask'

const maskConfig : Partial < NgxMaskConfig > = {
  validation : false ,
} ;

bootstrapApplication ( AppComponent , {
    providers : [
        ( ... )
        provideEnvironmentNgxMask ( maskConfig ) ,
        ( ... )
    ] ,
} ) . catch ( ( err ) => console . error ( err ) ) ;

ใช้ฟังก์ชั่นเพื่อกำหนดค่า:

 const maskConfigFunction : ( ) => Partial < NgxMaskConfig > = ( ) => {
  return {
    validation : false ,
  } ;
} ;

bootstrapApplication ( AppComponent , {
    providers : [
         ( ... )
         provideEnvironmentNgxMask ( maskConfigFunction ) ,
         ( ... )
] ,
} ) . catch ( ( err ) => console . error ( err ) ) ;

พร้อมระดับคุณสมบัติตัวเลือกการกำหนดค่า

@ Component ( {
    selector : 'my-feature' ,
    templateUrl : './my-feature.component.html' ,
    styleUrls : [ './my-feature.component.css' ] ,
    standalone : true ,
    imports : [ NgxMaskDirective , ( ... ) ] ,
    providers : [
          ( ... )
          provideNgxMask ( ) ,
          ( ... )
    ] ,
} )
export class MyFeatureComponent { }

จากนั้นนำเข้าคำสั่งท่อไปยังส่วนประกอบแบบสแตนด์อโลนที่จำเป็นและเพียงแค่กำหนดหน้ากากในอินพุต

ด้วยโมดูลเชิงมุม

@ NgModule ( {
  imports : [
      NgxMaskDirective , NgxMaskPipe
  ] ,
  providers : [ provideNgxMask ( ) ]
} ) 

QuickStart ถ้า NGX-MASK เวอร์ชัน <15.0.0

สำหรับเวอร์ชัน NGX-MASK <15.0.0 นำเข้าโมดูล NGX-MASK ในแอพเชิงมุม

ด้วยตัวเลือกการกำหนดค่าหน้ากากเริ่มต้น

 import { NgxMaskModule , NgxMaskConfig } from 'ngx-mask'

export const options : Partial < null | NgxMaskConfig > | ( ( ) => Partial < NgxMaskConfig > ) = null ;

@ NgModule ( {
  imports : [
    NgxMaskModule . forRoot ( ) ,
  ] ,
} )

ผ่านตัวเลือกการกำหนดค่าหน้ากากของคุณเอง

 import { NgxMaskModule , NgxMaskConfig } from 'ngx-mask'

const maskConfig : Partial < NgxMaskConfig > = {
  validation : false ,
} ;

@ NgModule ( {
  imports : [
    NgxMaskModule . forRoot ( maskConfig ) ,
  ] ,
} )

หรือใช้ฟังก์ชั่นเพื่อรับการกำหนดค่า:

 const maskConfigFunction : ( ) => Partial < NgxMaskConfig > = ( ) => {
  return {
    validation : false ,
  } ;
} ;

@ NgModule ( {
  imports : [
    NgxMaskModule . forRoot ( maskConfigFunction ) ,
  ] ,
} )

จากนั้นเพียงแค่กำหนดหน้ากากในอินพุต

เวอร์ชันที่สนับสนุนอย่างแข็งขัน

NGX-MASK เป็นไปตามนโยบายการสนับสนุนเชิงมุมอย่างเป็นทางการสนับสนุนเวอร์ชันแอคทีฟและ LTS (การสนับสนุนระยะยาว) ของ Angular จากการเปิดตัวล่าสุด V17 และใหม่ได้รับการสนับสนุน

โครงการที่ใช้เวอร์ชันเชิงมุมนอกช่วงที่รองรับ (เช่นเก่ากว่า V17) ควรใช้ NGX-mask รุ่นล่าสุดที่เข้ากันได้ อย่างไรก็ตามเวอร์ชันเหล่านี้จะไม่ได้รับการอัปเดตการแก้ไขข้อบกพร่องหรือคุณสมบัติใหม่อีกต่อไป

สำหรับข้อมูลโดยละเอียดเกี่ยวกับกำหนดเวลาและกำหนดการสนับสนุนของ Angular ให้ไปที่หน้า leases angular อย่างเป็นทางการ

การใช้งาน

เอกสารข้อความ

การบริจาค

เราจะรักการมีส่วนร่วมบางอย่าง! ตรวจสอบเอกสารนี้เพื่อเริ่มต้น