title: How to use ng2-canvas-whiteboard in ionic 3
body: <p>I want to use this npm-package in my Ionic 3 App:</p>
  
  <p><a href="https://www.npmjs.com/package/ng2-canvas-whiteboard" rel="nofollow noreferrer">https://www.npmjs.com/package/ng2-canvas-whiteboard</a></p>
  
  <p>I did everything it says in this link.</p>
  
  <p>Here is my package.json:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>  "dependencies": {
      "@angular/common": "4.0.2",
      "@angular/compiler": "4.0.2",
      "@angular/compiler-cli": "4.0.2",
      "@angular/core": "4.0.2",
      "@angular/forms": "4.0.2",
      "@angular/http": "4.0.2",
      "@angular/platform-browser": "4.0.2",
      "@angular/platform-browser-dynamic": "4.0.2",
      "@ionic-native/core": "3.4.2",
      "@ionic-native/splash-screen": "3.4.2",
      "@ionic-native/status-bar": "3.4.2",
      "@ionic/storage": "2.0.1",
      "ionic-angular": "3.1.1",
      "ionicons": "3.0.0",
      "ng2-canvas-whiteboard": "^1.1.1",
      "rxjs": "5.1.1",
      "sw-toolbox": "3.4.0",
      "zone.js": "^0.8.5"
    },</code></pre>
  </div>
  </div>
  </p>
  
  <p>This is the important part of my app.module.ts:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>import { CanvasWhiteboardModule } from 'ng2-canvas-whiteboard/index';
  
  @NgModule({
    declarations: [
      MyApp,
    ],
    imports: [
      BrowserModule,
      IonicModule.forRoot(MyApp),
     FormsModule,
     HttpModule,
     CanvasWhiteboardModule,
    ],
    bootstrap: [IonicApp],
    entryComponents: [
      MyApp,
    ],</code></pre>
  </div>
  </div>
  </p>
  
  <p>this is my page.ts:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import { Component, ElementRef, ViewChild, ViewEncapsulation } from '@angular/core';
  import { NavController, IonicPage } from 'ionic-angular';
  import {CanvasWhiteboardUpdate} from 'ng2-canvas-whiteboard';
  
  
  
  @IonicPage()
  @Component({
    selector: 'page-deskriptorenanalyse',  
    templateUrl: 'deskriptorenanalyse.html',
    encapsulation: ViewEncapsulation.None 
  })
  export class DeskriptorenanalysePage {
  
     constructor(public navCtrl: NavController)
     {
  
     }
     
  
    sendBatchUpdate(updates: CanvasWhiteboardUpdate[]) {
      console.log(updates);
    }
    onCanvasClear() {
      console.log("The canvas was cleared");
    }
    onCanvasUndo(updateUUID: string) {
      console.log(`UNDO with uuid: ${updateUUID}`);
    }
    onCanvasRedo(updateUUID: string) {
      console.log(`REDO with uuid: ${updateUUID}`);
    }
    
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>And this is the Page.html:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;ion-header&gt;
    &lt;ion-navbar&gt;
      &lt;button ion-button menuToggle&gt;
        &lt;ion-icon name="menu"&gt;&lt;/ion-icon&gt;
      &lt;/button&gt;
      &lt;ion-title&gt;Entwicklung der Schlüsselfaktoren&lt;/ion-title&gt;
    &lt;/ion-navbar&gt;
  &lt;/ion-header&gt;
  
  &lt;ion-content padding&gt;
  
  
  &lt;div&gt;
  &lt;canvas-whiteboard #canvasWhiteboard
                         [drawButtonClass]="'drawButtonClass'"
                         [drawButtonText]="'Draw'"
                         [clearButtonClass]="'clearButtonClass'"
                         [clearButtonText]="'Clear'"
                         [undoButtonText]="'Undo'"
                         [undoButtonEnabled]="true"
                         [redoButtonText]="'Redo'"
                         [redoButtonEnabled]="true"
                         [colorPickerEnabled]="true"
                         (onBatchUpdate)="sendBatchUpdate($event)"
                         (onClear)="onCanvasClear()"
                         (onUndo)="onCanvasUndo($event)"
                         (onRedo)="onCanvasRedo($event)"&gt;                    
  &lt;/canvas-whiteboard&gt;
  &lt;/div&gt;
  
  &lt;/ion-content&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I thought that I have done everything needed to use this package, but these errors are  occurring:</p>
  
  <p><a href="https://i.stack.imgur.com/jY69D.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/jY69D.png" alt="enter image description here"></a></p>
  
  <p>Can you tell what I did wrong or what is missing?</p>