Signature_pad: __WEBPACK_IMPORTED_MODULE_1_signature_pad__ bukan konstruktor

Dibuat pada 11 Apr 2018 · 8Komentar · Sumber: szimek/signature_pad

Saya telah mengimpor modul angular2-signature-pad dengan aplikasi angular cli 4.0 saya. Saya telah mengikuti instruksi https://github.com/dimpu/angular2-signature-pad dengan mengimpor ke modul baru. (Tidak ke modul aplikasi). Dengan ini kanvas signature-pad dirender dengan sempurna. Sayangnya dengan kesalahan berikut dan tidak berfungsi seperti yang diharapkan.

ERROR TypeError: __WEBPACK_IMPORTED_MODULE_1_signature_pad__ is not a constructor
at SignaturePadComponent.ngAfterViewInit (signature-pad.component.js:60)
at callProviderLifecycles (core.js:12702)
at callElementProvidersLifecycles (core.js:12669)
at callLifecycleHooksChildrenFirst (core.js:12652)
at checkAndUpdateView (core.js:13807)
at callViewAction (core.js:14149)
at execEmbeddedViewsAction (core.js:14107)
at checkAndUpdateView (core.js:13799)
at callViewAction (core.js:14149)
at execComponentViewsAction (core.js:14081)

Ada yang salah dengan inisialisasi SignaturePad?

Kesalahan muncul dengan baris kedua ini pada komponen pad tanda tangan

SignaturePadComponent.prototype.ngAfterViewInit = function () {
        this._canvas = this._el.nativeElement.querySelector("canvas");
        this._signaturePad = new SignaturePad(this._canvas);
    };

"sudut/cli": "1.6.8"
"angular2-signature-pad": "^1.0.2"
"signature_pad": "^2.3.2"
Di Google Chrome dengan CLI sudut

Sumber

erangaapp

Komentar yang paling membantu

Saya tidak memelihara versi Angular dari perpustakaan ini.

Anda dapat memeriksa SignaturePad apa yang sebenarnya ada - mungkin itu objek dengan properti default , yang merupakan konstruktor sebenarnya, jadi mungkin mengubahnya menjadi this._signaturePad = new SignaturePad.default(this._canvas); dapat memperbaikinya , tapi itu hanya tebakan.

Bisakah Anda memeriksa versi TypeScript yang Anda gunakan? Saya memeriksa perpustakaan ini (bukan yang Angular) dengan TS 2.7+ dan berfungsi dengan baik.

Ada juga rilis beta signature_pad yang ditulis dalam TS dan harus bekerja dengan TS 2.7+

szimek pada 11 Apr 2018

👍4 🎉1

Semua 8 komentar

Saya tidak memelihara versi Angular dari perpustakaan ini.

Bisakah Anda memeriksa versi TypeScript yang Anda gunakan? Saya memeriksa perpustakaan ini (bukan yang Angular) dengan TS 2.7+ dan berfungsi dengan baik.

Ada juga rilis beta signature_pad yang ditulis dalam TS dan harus bekerja dengan TS 2.7+

szimek pada 11 Apr 2018

👍4 🎉1

Ya itu bekerja dengan this._signaturePad = new SignaturePad.default(this._canvas);
Terima kasih banyak szimek

erangaapp pada 11 Apr 2018

@erangaapp @szimek bagaimana kabar kalian new SignaturePad ? Apakah Anda mengimpor sesuatu? Saya juga menggunakan https://github.com/dimpu/angular2-signature-pad

pedrofg pada 27 Apr 2018

Anda dapat mengimpornya dari signature_pad

npm install --save signature_pad
import * as SignaturePad from 'signature_pad';

erangaapp pada 27 Apr 2018

@erangaapp Terima kasih saya mengerti. Pertanyaan lain, apakah Anda mengubah baris menjadi this._signaturePad = new SignaturePad.default(this._canvas); di node_modules proyek Anda? Di dalam kode lib itu sendiri? Atau Anda dapat melakukannya dalam kode proyek Anda?

pedrofg pada 27 Apr 2018

Saya mengatasinya melalui di bawah ini

window.SignaturePad = require('signature_pad').default

glaidler pada 12 Apr 2019

👍1

this._signaturePad = new SignaturePad.default(this._canvas);

Ini adalah satu-satunya hal yang berhasil untuk saya

jacobjackson888 pada 13 Jun 2019

Jika ini bermanfaat bagi siapa pun, inilah yang telah saya lakukan agar pad tanda tangan berfungsi dengan Angular 8:

$npm install --save signature_pad

cool-component.html:

<div class="wrapper">
  <canvas id="signature-pad" class="signature-pad" width=400 height=200 style="border: 2px solid blue"></canvas>
</div>

keren-komponen.ts:

import { Component, OnInit, ElementRef  } from '@angular/core';
import * as SignaturePad from 'signature_pad'
...
export class CoolComponent implements OnInit {
    _canvas
    _signaturePad
    constructor(private el: ElementRef) { }

    ngOnInit() {

    }

       ngAfterViewInit(){
         this._canvas = this.el.nativeElement.querySelector("canvas");
         this._signaturePad = new SignaturePad.default(this._canvas);
      }

}

Terima kasih telah menyatukan perpustakaan ini, @szimek!