使用angularjs添加fusioncharts会给出：inject modulerr error

w9apscun 于 2023-11-16 发布在 Angular

关注(0)|答案(2)|浏览(113)

我想将fusioncharts添加到我的angularjs应用程序中。我已经点击了这个链接：
http://www.fusioncharts.com/blog/2015/03/angular-fusioncharts/
但是当我将ng-fusioncharts添加到我的app.js时：

var app = angular.module('myApp',['ngRoute', 'firebase','ng-fusioncharts']);

       app.config(function($routeProvider){
      $routeProvider
     .when('/', {
    controller: 'OrgListController',
    templateUrl: 'views/organization/list.html'
})

.when('/add_org', {
    controller: 'OrgAddController',
    templateUrl: 'views/organization/org_add.html'
})
.when('/edit_org/:id', {
    controller: 'OrgEditController',
    templateUrl: 'views/organization/org_edit.html'

})
.when('/add_access_point', {
    controller: 'AccessPointAdd',
    templateUrl: 'views/access_points/access_add.html'
})
.when('/edit_access_point/:id', {
    controller: 'AccessPointEdit',
    templateUrl: 'views/access_points/access_edit.html'

})
.when('/add_user', {
    controller: 'UserAdd',
    templateUrl: 'views/users/user_add.html'
})
.when('/edit_user/:id', {
    controller: 'UserEdit',
    templateUrl: 'views/users/user_edit.html'

})

.otherwise({
    redirectTo: '/'
});

字符串
}）;
什么都没有显示，我的整个项目不工作。在控制台查看说：

error: inject modulerr.................

型
有人建议如何在一个模块中添加多个依赖项吗？

angularjs

来源：https://stackoverflow.com/questions/42900689/adding-fusioncharts-with-angularjs-gives-inject-modulerr-error

2条答案

按热度按时间

mklgxw1f1#

你需要有fusion-chart.js才能注入ng-fusioncharts

var app = angular.module('HelloApp', ["ng-fusioncharts"])

字符串

DEMO

赞(0）回复(0）举报 2023-11-16

f0ofjuux2#

如果您尝试将自己的组件添加到ng模块中，也会发生此错误。这从未得到支持，从1.3.0开始，它实际上会触发此错误。例如，以下代码可能会触发此错误。

angular.module('ng').filter('tel', function (){});

字符串
相反，创建您自己的模块并将其作为依赖项添加到应用程序的顶级模块。

<html>
<head>
    <!-- Including AngularJS -->
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.2/angular.min.js"></script>
    <!-- Including the fusioncharts core library -->
    <script type="text/javascript" src="https://cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js"></script>
    <!-- Including the angularjs-fusioncharts directive-->
    <script type="text/javascript" src="https://unpkg.com/[email protected]/dist/angular-fusioncharts.js"></script>
    <!-- Including the fusion theme -->
    <script type="text/javascript" src="https://cdn.fusioncharts.com/fusioncharts/latest/themes/fusioncharts.theme.fusion.js"></script>
    <script type="text/javascript">
        var myApp = angular.module('myApp', ['ng-fusioncharts']);
        //STEP 2 - Chart Data
        const chartData = [
            { label: 'Venezuela', value: '290' },
            { label: 'Saudi', value: '260' },
            { label: 'Canada', value: '180' },
            { label: 'Iran', value: '140' },
            { label: 'Russia', value: '115' },
            { label: 'UAE', value: '100' },
            { label: 'US', value: '30' },
            { label: 'China', value: '30' }
        ];

        // STEP 3 - Chart Configurations
        const dataSource = {
            chart: {
                caption: "Countries With Most Oil Reserves [2017-18]",
                subCaption: "In MMbbl = One Million barrels",
                xAxisName: "Country",
                yAxisName: "Reserves (MMbbl)",
                numberSuffix: "K",
                theme: "fusion",
            },
            // Chart Data - from step 2
            "data": chartData
        };
        myApp.controller('MyController', ['$scope', function($scope) {
            // datasource
            $scope.myDataSource = dataSource
        }]);
    </script>

</head>

<body ng-app="myApp">
<div ng-controller="MyController">
<div fusioncharts id="my-chart-id" width="700" height="400" type="column2d" dataSource="{{myDataSource}}">
</div>
</div>
</body>
</html>

型
要了解更多有关此功能的信息，请参阅-https://www.fusioncharts.com/dev/getting-started/angular/angularjs/your-first-chart-using-angularjs

赞(0）回复(0）举报 2023-11-16

我来回答

使用angularjs添加fusioncharts会给出：inject modulerr error

2条答案

相关问题

热门标签

最新问答