$ injector:modulerr]由于以下原因,无法实例化模块nvd3: [英] $injector:modulerr] Failed to instantiate module nvd3 due to:

查看:68
本文介绍了$ injector:modulerr]由于以下原因,无法实例化模块nvd3:的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我关注了这篇文章: http://gonehybrid.com/使用d3-js/

I followed this post: http://gonehybrid.com/bring-your-ionic-app-to-life-getting-started-with-d3-js/

我拥有所有库,但不幸的是,我收到此错误:

I have all the libraries but unfortunately, I get this error:

Error: [$injector:modulerr] Failed to instantiate module starter due to:
[$injector:modulerr] Failed to instantiate module nvd3 due to:
[$injector:nomod] Module 'nvd3' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.5.3/$injector/nomod?p0=nvd3
minErr/<@http://localhost:8100/lib/ionic/js/ionic.bundle.js:13415:12
module/<@http://localhost:8100/lib/ionic/js/ionic.bundle.js:15381:17
ensure@http://localhost:8100/lib/ionic/js/ionic.bundle.js:15305:38
module@http://localhost:8100/lib/ionic/js/ionic.bundle.js:15379:14
loadModules/<@http://localhost:8100/lib/ionic/js/ionic.bundle.js:17871:22
forEach@http://localhost:8100/lib/ionic/js/ionic.bundle.js:13668:11
loadModules@http://localhost:8100/lib/ionic/js/ionic.bundle.js:17855:5
loadModules/<@http://localhost:8100/lib/ionic/js/ionic.bundle.js:17872:40
forEach@http://localhost:8100/lib/ionic/js/ionic

在Win7机器上的VirtualBox中运行Ubuntu 14.04:

Running Ubuntu 14.04 in VirtualBox on my Win7 machine:

dev@dev-VirtualBox:~/code/d3Examples/www/lib$ ls
angular          angular-nvd3      angular-ui-router  ionic
angular-animate  angular-sanitize  d3                 nvd3
dev@dev-VirtualBox:~/code/d3Examples/www/lib$ 

// Ionic Starter App

// angular.module is a global place for creating, registering and retrieving Angular modules
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
// the 2nd parameter is an array of 'requires'
angular.module('starter', [
  'ionic',
  'nvd3'
])

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    if (window.cordova && window.cordova.plugins.Keyboard) {
      // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
      // for form inputs)
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);

      // Don't remove this line unless you know what you are doing. It stops the viewport
      // from snapping when text inputs are focused. Ionic handles this internally for
      // a much nicer keyboard experience.
      cordova.plugins.Keyboard.disableScroll(true);
    }
    if (window.StatusBar) {
      StatusBar.styleDefault();
    }
  });
})

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
  <title></title>

  <link href="lib/ionic/css/ionic.css" rel="stylesheet">
  <link href="css/style.css" rel="stylesheet">

  <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->

  <!-- ionic/angularjs js -->
  <script src="lib/ionic/js/ionic.bundle.js"></script>

  <!-- cordova script (this will be a 404 during development) -->
  <script src="cordova.js"></script>

  <!-- your app's js -->
  <script src="js/app.js"></script>
  <script src="lib/d3/d3.js"></script>
  <script src="lib/nvd3/build/nv.d3.min.js"></script>
  <script src="lib/angular-nvd3/dist/angular-nvd3.min.js"></script>
  <link rel="stylesheet" href="lib/nvd3/build/nv.d3.css">

</head>

<body ng-app="starter">

  <ion-pane>
    <ion-header-bar class="bar-stable">
      <h1 class="title">Ionic Blank Starter</h1>
    </ion-header-bar>
    <ion-content>
    </ion-content>
  </ion-pane>
</body>

</html>

推荐答案

这是缺少的javascript依赖性问题.在index.html中,在加载外部库后加载app.js,因为angular模块由于不存在而无法实例化nvd3模块.

This is a missing dependency issue of javascript. In your index.html, load your app.js after you load the the external libraries, because angular module isn't able to instantiate the nvd3 module because it isn't there.

这应该是您的index.html

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
  <title></title>

  <link href="lib/ionic/css/ionic.css" rel="stylesheet">
  <link rel="stylesheet" href="lib/nvd3/build/nv.d3.css">
  <link href="css/style.css" rel="stylesheet">

  <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->

  <!-- ionic/angularjs js -->
  <script src="lib/ionic/js/ionic.bundle.js"></script>

  <!-- cordova script (this will be a 404 during development) -->
  <script src="cordova.js"></script>

  <script src="lib/d3/d3.js"></script>
  <script src="lib/nvd3/build/nv.d3.min.js"></script>
  <script src="lib/angular-nvd3/dist/angular-nvd3.min.js"></script>
  <!-- your app's js -->
  <script src="js/app.js"></script>

</head>

<body ng-app="starter">

  <ion-pane>
    <ion-header-bar class="bar-stable">
      <h1 class="title">Ionic Blank Starter</h1>
    </ion-header-bar>
    <ion-content>
    </ion-content>
  </ion-pane>
</body>

</html>

这篇关于$ injector:modulerr]由于以下原因,无法实例化模块nvd3:的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆