0

アプリケーションでangular-chart.jsを使用しようとしていますが、次のエラーが発生します。

Error: [$injector:nomod] Module 'chart.js' is not available

html ファイルの angular-chart.js の前に Chart.js を含めるという他の質問からの提案に従いましたが、これはうまくいきませんでした。

インストールしたライブラリのバージョンは次のとおりです。

angular チャート、chart.js および angular のバージョン

ここに私のディレクトリ構造があります:

 app/
 ----libs/
 ------Chart.js/
 ----------src/
 ------------chart.js
 ------angular-chart.js/
 --------dist/
 ----------angular-chart.js
 ----------angular-chart.css
 --index.html

これは、私のindex.htmlに bower とともにインストールされたライブラリへのリンクです。

<!-- Import the graph library -->
<script src="../libs/Chart.js/src/chart.js"></script>
<script src="../libs/angular-chart.js/dist/angular-chart.js" xmlns="http://www.w3.org/1999/html"></script>

<!-- CSS too -->
<link rel="stylesheet" href="../libs/angular-chart.js/dist/angular-chart.css">

次のように、chart.js モジュールをコントローラーに挿入しようとしています。

angular.module('DeviceCtrl', ['chart.js']).controller('DeviceController', function($routeParams, $scope, $http) { }

助言がありますか？ありがとう！

4

2 に答える 2

0

angular-chart ライブラリには詳しくありませんが、これまでに得たものにはいくつかの問題があります。まず、angular-chart のスクリプト タグには、xml ドキュメントに由来するはずの "xmlns" 属性が含まれています。

<script src="../libs/angular-chart.js/dist/angular-chart.js" xmlns="http://www.w3.org/1999/html"></script>

おそらく何も害はありませんが、ブラウザーに胸やけを与えていないことを確認するためだけに削除します.

次に、あなたは述べます

chart.js モジュールをコントローラーに挿入しようとしています

chart.js モジュールには、ディレクティブのみが含まれています。コントローラーに実際に注入することはできません。モジュールレベルでのみ依存関係を述べることができます。GitHubのreadmeには、この一連のディレクティブの適切な基本的なセットアップの例があります。コントローラーに注入できる ChartJsFactory という 1 つのファクトリがありますが、これは主にディレクティブによって使用されることを意図しているようです。

次に気付いたのは、コントローラーに $routeParams の依存関係を含めているが、モジュール DeviceCtrl には ngRoute への依存関係が含まれていないことです。モジュールの構成に angular-route.js と「ngRoute」の依存関係を含めるか、$routeParams を削除することができます。

于 2016-06-20T20:49:11.157 に答える
0

このエラーは、スクリプトが実行される前に angular-chart.js がロードされていないことを示しているようです。angular と chart.js がロードされた後、スクリプトが実行される前にロードする必要があります。

Nit: css は html の上部にロードする必要がありますが、javascript ファイルは body 終了タグの後の下部にロードする必要があります。

このテンプレートを使用して完全な再現手順を提供できますか?

于 2016-06-20T06:39:50.877 に答える