Generator-angular-fullstack不能添加angular-chart.js

generator-angular-fullstack cannot add angular-chart.js

本文关键字：js angular-chart 添加 不能 Generator-angular-fullstack      更新时间：2023-09-26

我最近开始使用angular，更具体地说是angular-fullstack生成器(https://github.com/angular-fullstack/generator-angular-fullstack)。

我尝试使用angular-chart-js (https://github.com/jtblin/angular-chart.js)库在我的应用程序中显示图形，但不成功。当我在"app"模块依赖中添加chart.js时，我总是得到一个错误。

我做了什么:

使用命令"npm install——save angular-chart.js"安装angular-chart.js(在我的应用根文件夹中)，我已经检查了"包"中的依赖项。json文件。

修改index.html和_index.html

<head>
    <script src="../node_modules/chart.js/dist/Chart.js"></script>
    <script src="../node_modules/angular-chart.js/dist/angular-chart.js"></script>
</head>

app.js 

angular.module('myApp', ['chart.js']);

这个配置给了我错误

模块'chart.js'不可用!您要么拼错了模块名，要么忘记加载它。如果注册一个模块，请确保将依赖项指定为第二个参数。

在我尝试了不同的配置后

将index.html和_index.html移到main.html

main.html 

<script src="../../../node_modules/chart.js/dist/Chart.js"></script>
<script src="../../../node_modules/angular-chart.js/dist/angular-chart.js"></script>

以另一种方式导入库，并禁用严格模式app.js。

app.js 

import chartJs from 'chart.js';
angular.module('myApp', [chartJs]);
angular.element(document)
  .ready(() => {
    angular.bootstrap(document, ['myApp'], {
      strictDi: false
    });
  });

在这个设置下，我得到了这个错误

错误:[$injector:modulerr]实例化模块函数(context, config)失败，原因:错误:[$injector:unpr] Unknown provider: context

如果你需要更多的信息，就告诉我。

提前感谢!

我找到bug了!!

这是我的变化

app.js 

import chartJs from 'angular-chart.js';
angular.module('myApp', [chartJs]);
angular.element(document)
  .ready(() => {
    angular.bootstrap(document, ['myApp'], {
      strictDi: true
    });
  });

库名错误，我可以重新启用"strict mode"

相关文章：