【问题标题】:Error: $injector:modulerr Module in angular when loading an image错误:$injector:modulerr 模块在加载图像时有角度
【发布时间】:2016-05-05 06:17:49
【问题描述】:

我正在尝试使用 Angular 从头开始​​创建轮播。所以我与该问题相关的html代码如下。

<div id = "section1" class = "" ng-app = "sliderApp">
    <div class = "sec1_slider" ng-controller = "app">
         <div class = "slider_image">
               <img ng-src="{{ imageUrlProfile }}" class = "sm_icon">

并且我已经导入了相关的 API。

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular-route.js"></script>

我的 Angular 代码如下。

var application = angular.module('sliderApp', ['ngRoute']);

application.controller('app', function($rootScope, $scope) {

        $rootScope.imageUrlProfile = 'slider-img1.png';

});

在登录页面中,我在角度代码“slider-img1.png”中定义的图像未加载,并在浏览器控制台中引发以下错误。

angular.js:4073 未捕获错误:[$injector:modulerr] http://errors.angularjs.org/1.3.5/$injector/modulerr?p0=sliderApp&p1=Refere...ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.5%2Fangular.min.js %3A16%3A463)

Click here to see the link to the error.

我应该怎么做才能加载图像?

编辑:Here you can find the JSFiddle

【问题讨论】:

  • 您是否在所需的角度脚本之后包含了您的角度代码?如果是,您可以创建一个小提琴吗?
  • @AnkitAgarwal 请查看编辑,我已经包含了所需的 js 文件。 &lt;script type="text/javascript" src = "js/app.js"&gt;&lt;/script&gt;
  • 您可以使用未缩小的角度版本并在此处提供完整的错误文本吗?
  • 在 js fiddle 你尝试使用未定义的ProfileCtrl,WorkCtrl,EduCtrl,这就是为什么你得到错误 Failed to instantiate module sliderApp due to: ReferenceError: ProfileCtrl is not defined ,所以可能在你的代码中出现同样的错误

标签: javascript angularjs html


【解决方案1】:

问题在于,在您的 config 块中,您正在为控制器指定变量。但变量尚未声明或赋值:

看看Plnkr:http://plnkr.co/edit/2kfnAMja5BWgKTWU9FHt?p=preview

var application = angular.module('sliderApp', ['ngRoute']);

application.controller('app', function($rootScope, $scope) {

        $rootScope.imageUrlProfile = 'http://www.amaraholisticwellbeing.com/wp-content/uploads/2015/01/Fall-beautiful-nature-22666764-900-562.jpg';

});

application.config(['$routeProvider', function($routeProvider) {
        $routeProvider.
            when('/option1', {templateUrl: 'tab1.html'/**, controller: ProfileCtrl**/}).
            when('/option2', {templateUrl: 'tab2.html'/**, controller: WorkCtrl**/}).
            when('/option3', {templateUrl: 'tab3.html' /**,controller: EduCtrl**/}).
            when('/', {templateUrl: 'openingTab.html'}).
            otherwise({redirectTo: '/'});
}]);

你可以看到我在哪里注释掉了控制器。这些变量在您的小提琴提供的脚本中不存在。我选择使用 Plnkr 是因为 JSFiddle 在尝试为图像发送正常的 http 请求(https 很好)时出现问题。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-03-09
    • 2017-03-28
    • 1970-01-01
    • 2016-11-16
    • 1970-01-01
    相关资源
    最近更新 更多