RetroSearch Browse

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://github.com/JsDaddy/ngx-mask below:

JsDaddy/ngx-mask: Angular Plugin to make masks on form fields and html elements.

A powerful Angular directive for input masking with customizable patterns

Created with ❤️ by

NGX-MASK is a feature-rich input mask directive for Angular applications that provides:

• Custom patterns & expressions

• Multiple mask patterns (|)

• Built-in common patterns

• Prefix & suffix support

• Thousand separators

• Decimal markers

• Negative numbers

• Leading zeros

• Real-time validation

• Clear on non-match

• Show/hide mask typing

• Keep character positions

• Leading zero handling

• AM/PM support

• Custom separators

• Multiple formats

• Custom placeholders

• Special characters

• Transform functions

• Custom validation

• Reactive Forms

• ControlValueAccessor

• Built-in validation

• Standalone support

Check out our live documentation and examples

# For Angular 17 and above
$ npm install ngx-mask    # Using npm
$ bun add ngx-mask       # Using bun

# For specific Angular versions:
# Angular 16.x.x
$ npm install ngx-mask@16.4.2    # Using npm
$ bun add ngx-mask@16.4.2       # Using bun

# Angular 15.x.x
$ npm install ngx-mask@15.2.3    # Using npm
$ bun add ngx-mask@15.2.3       # Using bun

# Angular 14.x.x
$ npm install ngx-mask@14.3.3    # Using npm
$ bun add ngx-mask@14.3.3       # Using bun

# Angular 13.x.x or 12.x.x
$ npm install ngx-mask@13.2.2    # Using npm
$ bun add ngx-mask@13.2.2       # Using bun

Package Manager Note: You can use either npm or bun based on your preference. Both package managers will work equally well with ngx-mask.

NGX-MASK follows Angular's official support policy, supporting Active and LTS versions. Currently supported:

Angular 17 and newer (latest features and updates)
For older Angular versions, use the corresponding NGX-MASK version as specified above

Note: Versions for Angular older than v17 will not receive new features or updates.

For Angular 15+ (Standalone) Application-wide Setup with Default Config

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

With Custom Configuration

import { NgxMaskConfig } from 'ngx-mask';

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

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

Feature-level Configuration

@Component({
    selector: 'my-feature',
    standalone: true,
    imports: [NgxMaskDirective],
    providers: [provideNgxMask()],
})
export class MyFeatureComponent {}

For Angular < 15 (NgModule) Application-wide Setup with Default Config

import { NgxMaskModule } from 'ngx-mask';

@NgModule({ imports: [NgxMaskModule.forRoot()] })
export class AppModule {}

With Custom Configuration

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

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

@NgModule({ imports: [NgxMaskModule.forRoot(maskConfig)] })
export class AppModule {}

Feature-level Configuration

import { NgxMaskModule } from 'ngx-mask';

@NgModule({ imports: [NgxMaskModule.forChild()] })
export class FeatureModule {}

Check out other projects by JSDaddy:

We welcome contributions! Please read our contributing guidelines to learn about our development process and how you can propose bugfixes and improvements.

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4