Angular 2+ directive that will increment (or decrement) a counter variable while your element is being pressed. Similar to Medium's claps.
To install this library, run:
$ npm install ngx-presson --saveAdd the directive in any element of your Angular application's template:
<!-- You can now use your library directive in app.component.html -->
<h1>{{title}}</h1>
<p><button [(presson)]="counter">Presson</button></p>
<p>Counter: {{counter}}</p>In your Angular AppModule, import the library:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
// Import the library
import { PressonModule } from 'ngx-presson';
@NgModule({
bootstrap: [ AppComponent ],
declarations: [ AppComponent ],
imports: [
BrowserModule,
// Specify the library as an import
PressonModule
]
})
export class AppModule {}
@Component()
class AppComponent {
counter = 0;
}| Parameter | Type | Default | Description |
|---|---|---|---|
| presson | number | null |
Counter value |
| pressonSpeed | number | 100 |
Counting speed in milliseconds |
| pressonWait | number | 0 |
Delay in ms before counting starts after the mouse press |
| pressonChange | event | null |
Change event to implement if using 'presson' for multiple elements |
MIT © Kris Nyunt