Skip to content

Instantly share code, notes, and snippets.

View highlight.directive.ts
import {Directive, HostBinding, Input, OnChanges, SecurityContext, SimpleChanges} from "@angular/core";
import {DomSanitizer, SafeHtml} from "@angular/platform-browser";
selector: "[appHighlight]",
export class HighlightDirective implements OnChanges {
searchTerm: string;
marcorinck / example.ts
Last active May 2, 2020
semi-automatic mock generation in TypeScript (uses Jest as testing framework)
View example.ts
import {clearMocks, Mock, mockClass, initMocks} from "mockclass";
import {ErrorService} from "../components/http/error.service";
describe('MyService', () => {
//use as a decorator in an empty holder class
class Mocks extends MockHolder {
errorService: ErrorService;
marcorinck / slide-down.transition.ts
Last active Oct 15, 2022
custom ionic page transitions: "slide" and "slide-down"
View slide-down.transition.ts
import {Animation} from "ionic-angular/animations/animation";
import {isPresent} from "ionic-angular/util/util";
import {PageTransition} from "ionic-angular/transitions/page-transition";
const DURATION = 500;
const TRANSFORM = "transform";
const MOVED_DOWN = "translateY(100%)";
const NOT_MOVED = "translateY(0)";
const ZINDEX = "z-index";
const OPACITY = "opacity";
marcorinck / animated-item.component.html
Last active Feb 13, 2018
An example when you need dynamic properties inside of an angular animation and need to implement the animation in ts code and not in the animation DSL
View animated-item.component.html
<card (click)="clicked()">
<card-title [ngStyle]="{'font-size': fontsize}">{{}}</ion-card-title>
<icon [svgIcon]="itemDetails.icon" [style.height.px]="iconWidthHeight"
[style.width.px]="iconWidthHeight" ></icon>
marcorinck / dropshadow.html
Created Dec 6, 2016
svg wave with dropshadow
View dropshadow.html
<svg viewBox="0 0 500 500" preserveAspectRatio="xMinYMin meet">
<defs xmlns="">
<filter id="dropshadow" height="130%">
<feGaussianBlur in="SourceAlpha" stdDeviation="3" />
<feOffset dx="2" dy="2" result="offsetblur" />
<feComponentTransfer xmlns="">
<feFuncA type="linear" slope="0.4" />
marcorinck / blueprint
Created Aug 25, 2013
AngularJS directive blueprint
View blueprint
var myModule = angular.module(...);
myModule.directive('directiveName', function (injectables) {
return {
restrict: 'A',
template: '<div></div>',
templateUrl: 'directive.html',
replace: false,
priority: 0,
transclude: false,
scope: false,