Yonatan Doron JonathanDn

💭

Building Reusable Vue Components

Frontend Craftsman

JonathanDn / app.consts.ts

Last active December 6, 2016 11:16

Angular2 - NgRedux Reducer, make a new state, change it from a sending component, subscribe to changes from a receiving component

	export module ItemsConsts {
	export const INIT_ITEM_TIMER = 'INIT_ITEM_TIMER';
	}

JonathanDn / maxlength.pipe.ts

Created November 9, 2016 17:59

	import { Pipe, PipeTransform } from '@angular/core';

	@Pipe({
	name: 'maxLength'
	})
	export class MaxLengthPipe implements PipeTransform {
	transform(value: string, limit: number){
	if (value.length > limit) return value.substring(0, limit) + '...';
	else return value;
	}

JonathanDn / getinitials.pipe.ts

Created November 3, 2016 13:58

Angular 2 pipe to turn string into initials

	import { Pipe, PipeTransform } from '@angular/core';

	@Pipe({
	name: 'getInitials'
	})

	export class GetInitialsPipe implements PipeTransform {
	transform(value: string) {
	return value.replace(/[a-z]/g, '').replace(' ', '');
	}

JonathanDn / mapfromkeyvalue.pipe.ts

Last active November 3, 2016 09:59

Angular 2 pipe to map key : value pair object array into object with property value pairs.

	import { Pipe, PipeTransform } from '@angular/core';

	@Pipe({
	name: 'mapFromKeyValue'
	})

	export class MapFromKeyValuePipe implements PipeTransform {
	transform(objArr) {
	console.log('obj array looks like this: ', objArr);
	let mappingObject = {};

JonathanDn / maptokeyvalue.pipe.ts

Created November 3, 2016 08:55

Angular 2 Pipe to map a property : value mapping object into an array of key value pair objects

	import { Pipe, PipeTransform } from '@angular/core';

	@Pipe({
	name: 'mapToKeyValue'
	})

	export class MapToKeyValuePipe implements PipeTransform {
	transform(obj: Object) {
	let modifiedArray = [];
	for (let key in obj) {

JonathanDn / scrollbar.directive.ts

Last active November 1, 2016 07:42

Angular 2 Malihu Custom Scrollbar Implmentation

	import {Directive, ElementRef, Input, Renderer} from '@angular/core';

	import 'jquery-mousewheel';
	import 'malihu-custom-scrollbar-plugin';

	@Directive({
	selector: "[app-scrollbar]"
	})

	export class ScrollbarDirective {