0

我正在尝试在我的应用程序中使用angular-chart.js ，但出现以下错误：

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

我已按照其他问题的建议在 html 文件中的 angular-chart.js 之前包含 Chart.js，尽管这对我不起作用。

以下是我安装的库的版本：

角度图表、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 库，但我发现您目前所拥有的一些问题。首先，角度图表的脚本标签有一个杂散的“xmlns”属性，该属性必须来自 xml 文档：

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

它可能不会伤害任何东西，但我会删除它以确保您不会让浏览器胃灼热。

接下来，你说

我正在尝试将 chart.js 模块注入我的控制器

chart.js 模块仅包含指令。你不能真正将它注入你的控制器，你只能在模块级别声明依赖关系。GitHub 上的自述文件为这组指令提供了一个很好的基本设置示例。有一个工厂，ChartJsFactory，您可以将其注入控制器，但看起来它主要是由指令使用的。

我注意到的下一件事是您在控制器中包含了 $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 回答