离子签名板

时间:2018-12-22 12:55:18

标签: ionic-framework

我在离子项目中安装了“ angular2-signaturepad”,并且创建了一个测试应用程序,并且运行良好,但是当我尝试与现有项目集成时,我发现“ signature-pad”不是一个已知元素”和'

function CreateShellLink(const LinkFileName, AssocFileName, Desc, 
WorkDir,Args, IconFileName: string; const IconIdx: Integer): Boolean;
var
  SL: IShellLink;    // shell link object
  PF: IPersistFile; // persistant file interface to shell link object
begin

  Result := False;
  ActiveX.CoInitialize(nil);
  try
    if ActiveX.Succeeded(
      ActiveX.CoCreateInstance(
      ShlObj.CLSID_ShellLink,
      nil,
      ActiveX.CLSCTX_INPROC_SERVER,
      ShlObj.IShellLink, SL)) then
    begin
      SL.SetPath(PChar(AssocFileName));
      SL.SetDescription(PChar(Desc));
      SL.SetWorkingDirectory(PChar(WorkDir));
      SL.SetArguments(PChar(Args));
      if (IconFileName <> '') and (IconIdx >= 0) then
        SL.SetIconLocation(PChar(IconFileName), IconIdx);
      PF := SL as ActiveX.IPersistFile;
     (*  this is where the external exception happens when debugging *)
     Result :=ActiveX.Succeeded(PF.Save(PWideChar(WideString(LinkFileName)), True));
    end;
  finally
    ActiveX.CoUninitialize;
  end;
end;

这是我面临的错误。我在app.module.ts文件中添加了“ CUSTOM_ELEMENTS_SCHEMA,NO_ERRORS_SCHEMA”。

这是我的sign.html代码:

exception class    : EExternalException
exception message  : External exception EEFFACE.

main thread ($1c2c):
762b08b2 +62 KERNELBASE.dll                            RaiseException
21b34ef7 +33 win32debugide100.bpl Win32Debug  1574  +3 
TWin32LinkUnit.GetCppDebugHook
21b357a3 +eb win32debugide100.bpl Win32Debug  1847 +11 
TWin32Process.DoLinkUnitCreated
2087dffb +07 dbkdebugide100.bpl   Debug       8341  +1 
TProcess.LinkUnitCreated
2087b8ef +57 dbkdebugide100.bpl   Debug       7058  +7 
TEvaluatorCallback.ntfyLinkUnitDelta
77750bab +4b ntdll.dll                                 
KiUserCallbackDispatcher
7654f386 +16 USER32.dll                                CallWindowProcA
20885499 +39 dbkdebugide100.bpl   Debug      11455  +3 TDebugger.DBKWndProc
20040e4c +14 rtl100.bpl           Classes    11583  +8 StdWndProc
765538bb +0b USER32.dll                                DispatchMessageA
201625f0 +fc vcl100.bpl           Forms       8105 +23 
TApplication.ProcessMessage
2016262a +0a vcl100.bpl           Forms       8124  +1 
TApplication.HandleMessage
2016291f +b3 vcl100.bpl           Forms       8223 +20 TApplication.Run
76a78652 +22 KERNEL32.DLL                              BaseThreadInitThunk

这是我的sign.ts代码:

<ion-content padding>
<signature-pad [ERROR ->][options]="signaturePadOptions" 
(onBeginEvent)="drawStart()" (onEndEvent)="drawComplete()"></signatur"): 
ng:///SignPageModule/SignPage.html@10:16
'signature-pad' is not a known element:
1. If 'signature-pad' is an Angular component, then verify that it is part of this module.
2. If 'signature-pad' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("

<ion-content padding>
[ERROR ->]<signature-pad [options]="signaturePadOptions" (onBeginEvent)="drawStart()" (onEndEvent)="drawComplet"): ng:///SignPageModule/SignPage.html@10:1
Error: Template parse errors:
Can't bind to 'options' since it isn't a known property of 'signature-pad'.
1. If 'signature-pad' is an Angular component and it has 'options' input, then verify that it is part of this module.
2. If 'signature-pad' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component

这是我的app.module.ts代码:

<ion-header>
  <ion-navbar>
    <ion-title>sign</ion-title>
  </ion-navbar>
</ion-header>

<ion-content padding>
    <ion-row [ngClass]="{'drawing-active': isDrawing}">
        <ion-col></ion-col>
        <ion-col style="border: 1px solid #5d6691;">
          <signature-pad [options]="signaturePadOptions" (onBeginEvent)="drawStart()" (onEndEvent)="drawComplete()" style="width: 50px; height: 580px; color: red;"> </signature-pad>
        </ion-col>
        <ion-col></ion-col>
    </ion-row>
    <ion-row>
        <ion-col>
         <button ion-button style="color: #fff; background: #e59c9c;" (click)="clearPad()">Clear</button>
        </ion-col>
        <ion-col>
      <button ion-button style="color: #fff; background: #4355a5;" (click)="savePad()">Save</button>
    </ion-col>
    <ion-col>
      <button ion-button style="color: #fff; background: #e59c9c;" (click)="delPad()">delete</button>
    </ion-col>
</ion-row>
<ion-row text-center>
    <ion-col width-120>
      <img [src]="signature" [hidden]= "signature == '' || signature == undefined " style="height: 200px;" />
    </ion-col>
</ion-row>

我希望签名板工作正常

1 个答案:

答案 0 :(得分:0)

请确保还将模块导入 sign.module.ts

import { SignaturePadModule } from 'angular2-signaturepad';


@NgModule({
  imports: [
    ...
    SignaturePadModule
  ],
  declarations: [SignPage]
})
export class SignPageModule {}