dkhrunov

@Component({
    selector: 'app-test',
    templateUrl: './test.component.html'
})
export class TestComponent implements OnChanges {
    @Input()
    public value1: string;

    @Input()
    public value2: number;

dkhrunov

export function OutsideZone(targetClass, functionName: string, descriptor) {
  const source = descriptor.value;
  descriptor.value = function(...data): Function {
    if (!this.ngZone) {
            throw new Error("Class with 'OutsideZone' decorator should have 'ngZone' class property with 'NgZone' class.");
        }
    return this.ngZone.runOutsideAngular(() => source.call(this,  ...data));
  };
  return descriptor;
}

dkhrunov

// for Angular less than 9 version
// EXAMPLE:
//      fromEvent(window, 'scroll')
//        .pipe(outsideZone(this.zone))
//        .subscribe(...);

export function outsideZone<T>(zone: NgZone) {
    return function(source: Observable<T>) {
      return new Observable(observer => {
        let sub: Subscription;

dkhrunov

import { Component, ChangeDetectionStrategy, Input } from '@angular/core';

@Component({
	selector: 'app-indicator',
	templateUrl: './indicator.component.html',
	styleUrls: ['./indicator.component.scss'],
	changeDetection: ChangeDetectionStrategy.OnPush,
	host: {
		'[class.active]': `active`,
		'[class.pulse]': `pulse`,

dkhrunov

// Spy on any element to which it is applied.
// Usage: <div appSpy>...</div>
@Directive({ selector: '[appSpy]' })
export class SpyDirective implements OnInit, OnDestroy {
	constructor(private logger: LoggerService) { }

  	ngOnInit() {
    	this.logger.log(`Spy: onInit`);
 	}

dkhrunov

import { Injectable, OnDestroy } from '@angular/core';
import { Subject } from 'rxjs';

/**
 * Сервис реализующий "живой" поток пока компонент не будет удален,
 * после удаления завершает поток.
 *
 * @see {@link https://medium.com/ngx/why-do-you-need-unsubscribe-ee0c62b5d21f|
 * Ссылка на статью, параграф - 'Использование сервиса NgOnDestroy'}
 *

dkhrunov

import { Directive, Input } from '@angular/core';
import { FormGroupDirective } from '@angular/forms';

@Directive({
	selector: '[ngrxConnectForm]'
})
export class NgrxConnectFormDirective {
	@Input('ngrxConnectForm')
	set data(value: any) {
		if (value) {

dkhrunov

import { Observable } from "rxjs";

export interface ISheduler {
	event: Observable<number>;
	isOnSchedule$: Observable<boolean>;
	isOnSchedule: boolean;
	setSchedule(time: number): void;
	start(): void;
	stop(): void;
}

dkhrunov

import { Directive, EventEmitter, HostBinding, HostListener, Output } from '@angular/core';

@Directive({
	selector: '[appDragAndDrop]'
})
export class DragAndDropDirective {

	@Output()
	public fileDropped = new EventEmitter<FileList>();

dkhrunov

<multiselect-search
    label="System"
    [value]="value"
    [optionTemplate]="optionTemplate"
    [searchResults]="searchResults$ | async"
    [loading]="loading$ | async"
    (search)="onSearchSystems($event)"
>
</multiselect-search>