Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angularjs/25.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 角度:[$injector:modulerr]未能实例化模块_Javascript_Angularjs_Gulp_Angular Route Segment - Fatal编程技术网

Javascript 角度:[$injector:modulerr]未能实例化模块

Javascript 角度:[$injector:modulerr]未能实例化模块,javascript,angularjs,gulp,angular-route-segment,Javascript,Angularjs,Gulp,Angular Route Segment,我一直在尝试为一个项目设置基本的AngularJS功能,但当涉及到包含角度路线时,我遇到了麻烦。两者都是1.4.8版。我目前正在使用gulprequire连接我的JS,这是我的主要javascript文件 // =require ../components/jquery/dist/jquery.min.js // =require ../components/angular/angular.js // =require ../components/angular-route/angula

我一直在尝试为一个项目设置基本的AngularJS功能,但当涉及到包含角度路线时,我遇到了麻烦。两者都是1.4.8版。我目前正在使用gulprequire连接我的JS,这是我的主要javascript文件

//  =require ../components/jquery/dist/jquery.min.js

//  =require ../components/angular/angular.js
//  =require ../components/angular-route/angular-route.js

$(document).ready(function() {

  // =require app/app.js

}); //  Doc ready is done!
还有我的app.js文件

var app = angular.module('myApp', ['ngRoute']);

app.controller("ctrl", ["$scope", 'ngRoute', function($scope) {

    $scope.test = "It works!";

}]);
我已经检查过了,所有的文件都连接正确了。ng应用程序和ng控制器属性位于我的HTML文件中。我尝试过添加和删除ngRoute注入,并切换文件的顺序,但没有效果。这是令人沮丧的,因为我使用Angular 1.4.5的方式几乎完全相同,没有出现这些问题,但我无法在这里复制相同的内容,即使回去。但是HTML中的{test}变量仍然没有呈现,像{2+3}这样的基本操作也没有呈现

编辑:这是指向我当前收到的原始错误消息的链接:

编辑2:调用应用程序和控制器的HTML代码部分:

<html lang="en" ng-app="myApp">
    <body ng-controller="ctrl">

    </body>
</html>


我正在使用nunjucks进行HTML动态生成,尽管我已经更改了语法,这样它就不会与Angular的双花括号冲突。

您不能将模块作为依赖项注入控制器中,您应该从控制器DI内联数组中删除
'ngRoute'

app.controller("ctrl", ["$scope", , function($scope) {
更新

基本上,真正的问题是,您正在使用requirejs(惰性地)加载角度组件脚本,因此,当您使用模块名
ng app=“myApp”
时,请开始查找
myApp
模块,而模块尚未加载,因此会抛出错误

因此,我建议您不要使用
ng-app
指令启动页面加载。相反,您应该等待与angular相关的所有脚本加载,然后使用
angular.bootstrap
方法惰性地引导angular应用程序

代码

$(document).ready(function() {
   requirejs(["app/app.js"], function(util) {
      angular.bootstrap(document, ['myApp']);
   });
}); 

ngRoute是一个提供程序,在使用前需要在模块配置部分进行配置。在控制器中使用它没有任何意义。以下是有效的版本:

angular.module('myApp', ['ngRoute']);

angular.module('myApp').controller("ctrl", ["$scope",function($scope) {

$scope.test = "It works!";

}]);

此外,您需要在计划呈现应用程序的html元素中使用指令
ng app=myapp
调用您的模块。

感谢您的建议,尽管我以这种方式进行了设置,但仍然得到了相同的错误:(请你把你正在使用的html放进去好吗?我已经试过了,但还是得到了同样的错误。如果有帮助的话,我会更新原始消息,以包含我得到的特定错误消息。我实际上使用gulp include进行文件连接,尽管在页面加载之前加载角度脚本的问题仍然存在。我尝试了在添加requireJS后,上面的解决方案出现了一个无尽的console.log错误。我在app.js文件中为angular脚本编写了更多的/=require代码,因此它们是在页面加载后出现的。不再出现任何错误,这很好,但angular仍然无法工作,因为数据绑定无法正常工作。不过,修复了一个小的语法错误,我现在很好!非常感谢你的帮助!很高兴帮助你..谢谢:)