diff --git a/app/components/chips.ts b/app/components/chips.ts
index 19b2df3..24d4780 100644
--- a/app/components/chips.ts
+++ b/app/components/chips.ts
@@ -6,7 +6,7 @@ import {Component} from "@angular/core"
Tag1close
Tag2close
-
+
@@ -29,4 +29,11 @@ export class Chips {
secondaryPlaceholder: 'Enter a tag',
};
+ add(chip) {
+ console.log("Chip added: " + chip.tag);
+ }
+
+ delete(chip) {
+ console.log("Chip deleted: " + chip.tag);
+ }
}
diff --git a/src/custom-event-polyfill.ts b/src/custom-event-polyfill.ts
index f19cbb8..627884e 100644
--- a/src/custom-event-polyfill.ts
+++ b/src/custom-event-polyfill.ts
@@ -1,6 +1,6 @@
-export function CustomEvent ( type, params = { bubbles: false, cancelable: false, detail: undefined } ) {
+export function CustomEvent ( type, detail = undefined, params = { bubbles: false, cancelable: false } ) {
var event = document.createEvent( 'CustomEvent' );
- event.initCustomEvent( type, params.bubbles, params.cancelable, params.detail );
+ event.initCustomEvent( type, params.bubbles, params.cancelable, detail );
return event;
}
if ("Event" in window) {
diff --git a/src/materialize-directive.ts b/src/materialize-directive.ts
index 0446a80..bcaa691 100644
--- a/src/materialize-directive.ts
+++ b/src/materialize-directive.ts
@@ -148,6 +148,14 @@ export class MaterializeDirective implements AfterViewInit,DoCheck,OnChanges,OnD
picker.set('select', jQueryElement.val(), ...this._params));
}
+ if (this.isChips()) {
+ const nativeElement = this._el.nativeElement;
+ const jQueryElement = $(nativeElement);
+ jQueryElement.on("chip.add", (e,chip) => nativeElement.dispatchEvent((CustomEvent("chip.add",chip))));
+ jQueryElement.on("chip.delete", (e,chip) => nativeElement.dispatchEvent((CustomEvent("chip.delete",chip))));
+ jQueryElement.on("chip.select", (e,chip) => nativeElement.dispatchEvent((CustomEvent("chip.select",chip))));
+ }
+
if (this.isTextarea()) {
this._el.nativeElement.dispatchEvent((CustomEvent("autoresize", {bubbles: true, cancelable: false, detail: undefined})));
}
@@ -209,6 +217,10 @@ export class MaterializeDirective implements AfterViewInit,DoCheck,OnChanges,OnD
return (this._functionName && this._functionName === "pickadate");
}
+ private isChips() {
+ return (this._functionName && this._functionName === "material_chip");
+ }
+
private isAutocomplete() {
return (this._functionName && this._functionName === "autocomplete");
}