导航失败：模板解析错误：由于它不是'signature-pad'的已知属性，因此无法绑定到'options'

我正在尝试在我的ionic 3项目中实现angular2签名板，但出现上述问题时出现错误。我正在关注本教程链接。它在ionic2中工作正常，但是当我在ionic 3中尝试时，出现如下错误

Failed to navigate:  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. ("
    
    
      ][options]="signaturePadOptions" (onBeginEvent)="drawStart()" (onEndEvent)="drawComplete()">
    
      [ERROR ->]


  
您可以像这样获得完整的代码，就像我只是尝试在此   https://devdactic.com/signature-drawpad-ionic-2/
  
  
我认为当我使用深度链接导航时出现此错误，但是当我将组件导入到app.module.ts时，一切正常


更新

这是我的.ts文件

export class Conformsign {

  signature = '';
  isDrawing = false;
  finalData
  @ViewChild(SignaturePad) signaturePad: SignaturePad;
  @Input()
  private signaturePadOptions: Object = { // Check out https://github.com/szimek/signature_pad
    'minWidth': 2,
    'canvasWidth': 400,
    'canvasHeight': 200,
    'backgroundColor': '#f6fbff',
    'penColor': '#666a73'
  };

  constructor(public navCtrl: NavController, public navParams: NavParams, public toastCtrl: ToastController, public holders: Holders, public rest:Rest) {

    this.finalData = this.holders.getData();
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad Conformsign');
  }

  ionViewDidEnter() {
    this.signaturePad.clear()
  }

  drawComplete() {
    this.isDrawing = false;
  }

  drawStart() {
    this.isDrawing = true;
  }

  savePad() {
    this.signature = this.signaturePad.toDataURL();
    this.signaturePad.clear();
    let toast = this.toastCtrl.create({
      message: 'New Signature saved.',
      duration: 3000
    });
    toast.present();

     let cOnformDelivery= {
      order_id: this.finalData.order_id,
      amountpaid:this.finalData.total,
      customername:this.finalData.firstname,
      signature:this.signature,
      user_id:this.finalData.user_id,
      customer_id:this.finalData.customer_id
    }

  }

  clearPad() {
    this.signaturePad.clear();
  }

}


这是我的.html


  
Please draw your Signature
  
    
    
      
    
    

  
  Clear
  Save

  
    
    
      
    
    
  



    

  




  
  
  

    

      

        小智..
         6
      
      
我也面临这个问题。我通过对devdactic https://devdactic.com/signature-drawpad-ionic-2/上的原始帖子进行评论来解决了这个问题

一个叫Ka mok的家伙向我指出了一些东西

如果您在组件中使用签名板。就我而言，在农民组件中使用它，该组件通常具有farmer.module.ts文件。因此，只需导入签名板模块，一切就可以正常工作

例如

farmer.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { FarmerPage } from './farmer';
import { SignaturePadModule } from 'angular2-signaturepad';

@NgModule({
  declarations: [
    FarmerPage,
  ],
  imports: [
    IonicPageModule.forChild(FarmerPage),
    SignaturePadModule // this saved my life
  ],
})
export class FarmerPageModule {}


农民

import { Component, ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { SignaturePad } from 'angular2-signaturepad/signature-pad';
import { NativeStorage } from '@ionic-native/native-storage';
import { ToastController } from 'ionic-angular';


最后确保您也将模块导入到app.module.ts中

我希望这可以帮助别人。谢谢


1> 小智..：
我也面临这个问题。我通过对devdactic https://devdactic.com/signature-drawpad-ionic-2/上的原始帖子进行评论来解决了这个问题

一个叫Ka mok的家伙向我指出了一些东西

如果您在组件中使用签名板。就我而言，在农民组件中使用它，该组件通常具有farmer.module.ts文件。因此，只需导入签名板模块，一切就可以正常工作

例如

farmer.module.ts

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { FarmerPage } from './farmer';
import { SignaturePadModule } from 'angular2-signaturepad';

@NgModule({
  declarations: [
    FarmerPage,
  ],
  imports: [
    IonicPageModule.forChild(FarmerPage),
    SignaturePadModule // this saved my life
  ],
})
export class FarmerPageModule {}


农民

import { Component, ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { SignaturePad } from 'angular2-signaturepad/signature-pad';
import { NativeStorage } from '@ionic-native/native-storage';
import { ToastController } from 'ionic-angular';


最后确保您也将模块导入到app.module.ts中

我希望这可以帮助别人。谢谢