Quantity Input

Quantity input for shopping cart.

Live Preview

How to use

Install package

npm install @nghacks/quantity-input

Import QuantityInputModule to your consumer module.

import { NgModule } from '@angular/core';
...
...
import { QuantityInputModule } from '@nghacks/quantity-input';

@NgModule({
  declarations: [
    ...
  ],
  imports: [
    ...
    QuantityInputModule
  ]
})
export class ConsumerModule { }

Use with reactive form or template driven form

<!-- Basic -->
<quantity-input></quantity-input>

<!-- Reactive Form -->
<quantity-input formControlName="quantity"></quantity-input>

<!-- Template Driven Form -->
<quantity-input [(ngModel)]="quantity"></quantity-input>

Inputs

  /**
   * @description Use Mat Color `color='accent' / color='primary`
   */
  @Input() color: string;

  /**
   * @description Max limit of quantity
   */
  @Input() limit = 10000000;

  /**
   * @description Disables quantity input
   * @note Can be used with reactive for api
   */
  @Input() disabled: boolean;

Outputs

  /**
   * @description Emits on input change
   */
  @Output() quantityChange: number;