Do you have any question or suggestion ? Please do not hesitate to contact us! Alternatively, provide a PR | open an appropriate issue here

If did you like this project, support angular-material-extensions by starring ⭐ and sharing it 📢

• Demo
• Dependencies
• Peer Dependencies
• Additional Requirements - material (Include a theme)
• Installation
• Usage
• Documentation
• Development
• Other Angular Libraries
• Support
• License

View all the directives and components in action at https://angular-material-extensions.github.io/input-counter

• Angular (requires Angular

Now install @angular-material-extensions/input-counter via:

npm install --save @angular-material-extensions/input-counter

for the ui input component, please consider to install the following packages

• angular animations v14.x
• angular forms v14.x
• angular material v14.x
• angular cdk v14.x

npm i @angular/cdk @angular/material @angular/animations @angular/forms 

• angular material theme

Note:If you are using SystemJS, you should adjust your configuration to point to the UMD bundle. In your systemjs config file, map needs to tell the System loader where to look for @angular-material-extensions/input-counter:

{
  '@angular-material-extensions/input-counter';: 'node_modules/@angular-material-extensions/input-counter/bundles/input-counter.umd.js',
}

Once installed you need to import the main module:

import { MatInputCounterModule } from '@angular-material-extensions/input-counter';

The only remaining part is to list the imported module in your application module. The exact method will be slightly different for the root (top-level) module for which you should end up with the code similar to (notice MatInputCounterModule.forRoot()):

import { MatInputCounterModule } from '@angular-material-extensions/input-counter';

@NgModule({
  declarations: [AppComponent, ...],
  imports: [
     MatInputCounterModule, ...],  
  bootstrap: [AppComponent]
})
export class AppModule {
}

Other modules in your application can simply import MatInputCounterModule:

import { MatInputCounterModule } from '@angular-material-extensions/input-counter';

@NgModule({
  declarations: [OtherComponent, ...],
  imports: [
     MatInputCounterModule, ...], 
})
export class OtherModule {
}

 <mat-input-counter [min]="1"
                    [max]="10"
                    [step]="0.5"
                    [label]="Your label"
                    placeholder="your place holder">
        </mat-input-counter>

      <form [formGroup]="formGroup">
        <mat-input-counter formControlName="inputCounter"
                           [min]="+options.min"
                           [max]="+options.max"
                           [step]="+options.step"
                           [label]="options.label"
                           [placeholder]="options.placeholder">
        </mat-input-counter>
      </form>

formGroup: FormGroup;

 this.formGroup = new FormGroup({
      inputCounter: new FormControl()
    });

Please checkout the full documentation here

1. clone this repo
2. Install the dependencies by running npm i
3. go to lib directory under projects/angular-material-extensions/input-counter
4. build the library npm run build

• ngx-auth-firebaseui
• ngx-linkifyjs
• @firebaseui/ng-bootstrap
• @angular-material-extensions/pages
• @angular-material-extensions/link-preview
• @angular-material-extensions/password-strength
• @angular-material-extensions/google-maps-autocomplete
• @angular-material-extensions/select-country
• @angular-material-extensions/fab-menu
• @angular-material-extensions/faq
• @angular-material-extensions/contacts

• Drop an email to: Anthony Nahas
• or open an appropriate issue
• let us chat on Gitter

Built by and for developers ❤️ we will help you 👊

Copyright (c) 2020 Anthony Nahas. Licensed under the MIT License (MIT)