Adding angular2-signaturepad to systemjs.config file

[wulfsolter]

Adding angular2-signaturepad to systemjs.config file

[wulfsolter]

Impressive. Most impressive. Obi-Wan has taught you well. You have controlled your fear. Now, release your anger. Only your hatred can destroy me

[lathonez]

Hey,

We recommend using ng-cli (as is recommended by the angular team).

If you insist on using something else. you'll need to raise issues on that repo. Your problem is "I don't know how to include modules with angular quick start".

StackOverflow is the appropriate resource for these kinds of questions isn't it?

See also #12.

[cyberjared]

Don't forget that signature_pad is a dependency of this project, so you have to add that also

[animishas]

@technamrit : Were you able to resolve this issue? I am kinda having the same issue and I am using angular quickstart. Please reply. thanks

[smuthuvels]

I was getting some exception while using "angular2-signaturepad" package. So i have tried to "angular2-signature-pad" package. its working for me.
Package.json:
"angular2-signature-pad": "1.0.2"

system.config.js

 map: {
            'angular2-signature-pad': 'npm:angular2-signature-pad/bundles/angular2-signature-pad.umd.min.js',
            'signature_pad': 'npm:signature_pad'
},
packages: {
            'angular2-signature-pad': { main: '', defaultExtension: 'js' },
            'signature_pad': { main: 'dist/signature_pad', defaultExtension: 'js' }
}

app.module.ts

import { SignaturePadModule } from 'angular2-signature-pad';

@NgModule({
    imports: [
SignaturePadModule]
})

test.ts:
import { SignaturePadModule } from 'angular2-signature-pad';

```

onSaveHandler(data: any) {
console.log(data);
}

onClearHandler() {
    console.log('On Clear click');
}

**test.html:**
<signature-pad (onSave)="onSaveHandler($event)"
                                       (onClear)="onClearHandler()"
                                       [width]="500"
                                       [height]="300"
                                       [hideFooter]="false"
                                       [label]="label"></signature-pad>

Reference URL: [(https://next.plnkr.co/edit/32nEL74I48dDDWermSWQ?p=preview&utm_source=legacy&utm_medium=banner&utm_campaign=next&preview)]

[chirag115]

If anyone still using SystemJS, Following is my solution:

map: {
	'angular2-signaturepad': 'npm:angular2-signaturepad/bundles/angular2-signaturepad.umd.js',
    'signature_pad': 'npm:signature_pad/dist/signature_pad.js'
}
packages: {
    'angular2-signaturepad': { defaultExtension: 'js', format: 'cjs'  },
    'signature_pad': { defaultExtension: 'js' }
}