2016-10-03 6 views
1

Angular2アプリケーションで印刷機能を実装しようとしています。私はこのパッケージhtml2canvasを見つけました。それは印象的ですが、私がアプリケーションにそれを含めると、エラーが表示されます。ここでangular2でhtml2canvasを使用するTypescriptアプリケーションでエラーが発生する

は私がhere

  • から

    1. ダウンロードのjsファイルを追加しました<script src="scripts/html2canvas.js"></script>
    2. TSファイルで宣言
    3. declare var html2canvas: any;
    4. は、ユーザが印刷をクリックしたとき(を印刷するためのコードを追加して続いている私の手順ですボタン - テストコード)

      printview(): void { html2canvas(document.body).then(function(canvas) { document.body.appendChild(canvas); }); }

    しかし、すぐに私はすべてのヘルプやヒントエラー

    browser_adapter.ts:78 ReferenceError: html2canvas is not defined

    を次取得ユーザクリック印刷ボタンとして有用であろう...

  • +0

    html2canvas.jsが実際にロードされたことを確認しましたか? – sideroxylon

    +0

    はい、私は検証しました...正常にロードされています... – microchip78

    答えて

    4

    活字体は、定義が必要VanillaJSフレームワークを識別するためです。それの

    だと思うこのように、活字体は、オブジェクトをindentifyするために、それがぐるぐるTSファイルに依存し、html2canvasは、あなたのHTMLに含まれているが、活字体は今html2canvasオブジェクトを識別する方法を持っています。

    考えられる解決策:ベスト


    活字体2へのアップグレード*と新しい 'typeRoots' と 'タイプ' フィールドを使用します。

    TS 2.0+

    npm i @types/html2canvas

    などのようなあなたの 'tsconfig.json' ファイルを更新するにアップグレードした後、次の手順に従います。

    { "compilerOptions": { // your options, "typeRoots": [ "./node_modules/@types" ], "types": [ "html2canvas" ] } }


    を許容

    手動で定義ファイルをダウンロードします(手動で最新バージョンを取得して、更新された定義をすべて保持する必要があるため推奨されません)。


    クイックや汚れ

    「references.dを作成します。TS:html2canvas 『あなたのルートフォルダ内のファイル(次のtsconfig.jsonまで)と次のように記述

    declare var html2canvas: any;

    これにより、transpilerはコーダとして、あなたが知っていることを知っているだろう』存在、これにも大きな欠点(これはエラーとしてそれを考慮しませんので、 『ソリューション』はあなたがそう基本的にあなただけのブラインドのコードを書いているライブラリのためのIntelliSenseのサポートを持っていないということである。


    ですから、頑丈なプロジェクトのために私はこのことをお勧めします最高解決策、テスト目的のためにTSで遊びたいだけなら、他の解決策はどれもOKです:)

    新しいタイプのプロパティの詳細を読みたい場合は、TS2に含まれ、この他の質問への回答読み:

    https://www.typescriptlang.org/docs/handbook/compiler-options.html

    Typescript 2.0. "types" field in tsconfig.json

    そしてもちろん

    は、マニュアルを参照し
    +0

    'tsconfig、json'ファイルで 'typeRoots'が指定されている場合、' types'要素を追加指定するとエラーになりませんか?私。 'typeRoots'を指定するだけで十分ではないでしょうか? – Cuga

    +0

    偉大な答えをありがとう。 私は.then(...)に入ることはありません。次のエラーが表示されます: __WEBPACK_IMPORTED_MODULE_7_html2canvas__は機能ではありません 私の考えは分かります! – Toolsmythe

    関連する問題