ngx mask

NGX面具

NGX蒙版是解决所需模式的掩盖输入的最佳指令

您也可以尝试我们的NGX加载器指示器检查。您也可以尝试我们的NGX复复结果检查。

您可以尝试使用示例的实时文档

安装

Angular版本17.xx

$ npm install --save ngx-mask

Angular版本16.xx

$ npm install --save [email protected]

Angular版本15.xx

$ npm install --save [email protected]

角版14.xx

$ npm install --save [email protected]

Angular版本13.xx或12.xx

$ npm install --save [email protected]

QuickStart如果NGX蒙版版本> = 15.0.0

导入NGX蒙版指令，管道并为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面具版本<15.0.0

对于版本NGX蒙版<15.0.0在Angular应用中导入NGX蒙版模块。

使用默认蒙版配置选项

 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面具遵循官方的角度支持政策，支持Angular的主动和LTS（长期支持）版本。截至最新版本，Angular V17和Newer得到了支持。

使用受支持范围以外的角版本（例如，比V17年龄较大）的项目应使用NGX蒙版的最后一个兼容版本。但是，这些版本将不再接收更新，错误修复或新功能。

有关Angular的版本控制和支持时间表的详细信息，请访问官方Angular版本页面。

用法

文本文档

贡献

我们会喜欢一些贡献！查看此文档以开始。