• Stars
    star
    397
  • Rank 108,561 (Top 3 %)
  • Language
    TypeScript
  • License
    MIT License
  • Created about 7 years ago
  • Updated over 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Helpful decorators for typescript projects

npm Build Status Commitizen friendly semantic-release Awesome

Helpful Decorators For Typescript Projects

Installation

npm install helpful-decorators
yarn add helpful-decorators

Usage

delay - Add setTimeout functionality to the method

import { delay } from 'helpful-decorators';

class Test {
 @delay(1000)
 method() {
   // ...
 }
}

debounce - Add debounce functionality to the method (options)

import { debounce } from 'helpful-decorators';

class Test {
 @debounce(1000, options)
 method() {
   // ...
 }
}

throttle - Add throttle functionality to the method (options)

import { throttle } from 'helpful-decorators';

class Test {
 @throttle(1000, options)
 method() {
   // ...
 }
}

once - Add once functionality to the method

import { once } from 'helpful-decorators';

class Test {
 @once
 method() {
   // This will run only once
 }
}

measure - measure time taken by a function to execute

import { measure } from 'helpful-decorators';

class Test {
 @measure
 doSomething() {
   // Call to doSomething took 0.35 milliseconds.
 }

 @measure
 async doSomethingHello(){
    // Call to doSomethingHello took 0.35 milliseconds. 
 }
}

Mixin - this pattern is used to achieve multiple inheritance

import { Mixin } from 'helpful-decorators';

@Mixin([Disposable, Activatable])
class Test {
}

memo - memoizes the result of the function

import { memo } from 'helpful-decorators';

class Test {
 
  @memo()
  method() {
    ...memoized
  }
}

bind - automatically bind methods to class instances

import { bind } from 'helpful-decorators';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  constructor() {
    document.body.addEventListener('click', this.onClick);
  }

  @bind
  onClick($event) {
    console.log($event);
  }
}

SortBy - sort an array by a specific property in individual elements or non-object items (By default, it sorts by type === 'string' and isDescending === true)

import { SortBy } from 'helpful-decorators';

class Test {
  
  @SortBy('name', {
    isDescending: false,
    type: 'string'
  })
  names = [ { name: 'b' }, { name: 'a' }, { name: 'c' } ];

  @SortBy('', {
    isDescending: true,
    type: 'date'
  })
  dates = [ '2020-06-17', '2020-06-16', '2020-06-20', '2020-06-10' ];

  @SortBy('', {
    isDescending: false,
    type: 'number'
  })
  numbers = [ 6, 3, 4, 1 ];
}

License

MIT

More Repositories

1

ngx-auto-unsubscribe

Class decorator that will automatically unsubscribe from observables
TypeScript
346
star
2

vue-generate-component

Vue js component generator
JavaScript
220
star
3

ngrx-generator

ngrx templates generator
TypeScript
131
star
4

ng-file-upload

TypeScript
52
star
5

paginate-array

Array pagination
JavaScript
41
star
6

angular2-take-until-destroy

Declarative way to unsubscribe from observables when the component destroyed
TypeScript
38
star
7

ng-suspense

TypeScript
36
star
8

nb-choices

Angular wrapper for choices.js, vanilla, lightweight, configurable select box/text input plugin
TypeScript
33
star
9

ng-select

TypeScript
23
star
10

transloco-with-nx-libs

inline loaders
TypeScript
21
star
11

akita-ng-forms-manager

😍 Manage Angular forms with Akita
TypeScript
21
star
12

ng2cli

Angular 2 cli generator
JavaScript
18
star
13

ngrx-todos-full

ngrx-todos-full
TypeScript
18
star
14

cyrun

cypress run that lets you select files or folders to run
JavaScript
15
star
15

ngx-event-modifiers

Event Modifiers for Angular Applications https://netbasal.com/implementing-event-modifiers-in-angular-87e1a07969ce
TypeScript
14
star
16

ivy-lazy-components

TypeScript
13
star
17

ngx-stop-propagation

βœ‹ Stop propagation for everyday events with Angular directives 🎩
JavaScript
13
star
18

ngx-mobx

Mobx decorators for Angular Applications
TypeScript
13
star
19

angular-forms-unsaved-changes

TypeScript
10
star
20

angular2-storage-sync

Angular2 decorator to sync properties automatically from/to LocalStorage or SessionStorage
JavaScript
9
star
21

spectator-cli

Spectator templates generator
Smarty
8
star
22

ngrx-todos

Todo app with ngrx/store and ngrx/effects
TypeScript
8
star
23

ng-accordion-tutorial

TypeScript
7
star
24

ngx-text-equality-validator

Angular, compare text fields validator - useful for password match fields
JavaScript
6
star
25

akita-vue

TypeScript
5
star
26

rxjs-event-emitter

Event Emitter based on RxJS
TypeScript
4
star
27

akita-cli

JavaScript
4
star
28

akita-ng-devtools

TypeScript
4
star
29

ngrx-chat-client

TypeScript
3
star
30

angular2-shave

Angular 2 wrapper directive for shave - A modern javascript plugin for truncating text within a html element
JavaScript
3
star
31

transloco-ssr

TypeScript
3
star
32

angular2-text-equality-validator

Angular 2 compare text fields validator - useful for password match fields
TypeScript
3
star
33

ng-autocomplete

TypeScript
3
star
34

angular2-package-starter

Easy to use package starter for Angular 2
TypeScript
2
star
35

react-elf-movies

TypeScript
2
star
36

transloco-plugins-playground

TypeScript
2
star
37

efi-lum

TypeScript
2
star
38

ng-webpack-playground

TypeScript
2
star
39

ngrx-chat-server

JavaScript
2
star
40

akita-multi-active

TypeScript
1
star
41

audioCodesNetanel

CSS
1
star
42

ngx-in-view

JavaScript
1
star
43

circleci

TypeScript
1
star
44

zillow

zillow
JavaScript
1
star
45

paginate-array-ts

Pagination for arrays in javascript
TypeScript
1
star
46

transloco-keys-manager-playground

TypeScript
1
star
47

angular-fakeasync

HTML
1
star
48

6to5boilerplate

6to5boilerplate
JavaScript
1
star
49

polls

polls
JavaScript
1
star
50

akita-auth

TypeScript
1
star