我遵循了如何组织和Angular项目的教程。我有一个ng
目录,其中包含我的所有控制器,服务和我的routes.js
。然后,我将app.js
配置文件捆绑在一起gulp
。
我的module.js
是这样的:
var app = angular.module('app', [
'ngRoute',
'ui.bootstrap'
]);
这是我的routes.js
:
angular.module('app')
.config(function ($routeProvider) {
.when('/login', { controller: 'LoginCtrl', templateUrl: 'login.html'})
});
以下是我的工作LoginCtrl
的样子:
angular.module('app')
.controller('LoginCtrl', function($scope, UserSvc) {
$scope.login = function(username, password) {
...
}
})
该教程没有使用任何Angular模块,我想尝试一下。我从CDN向我的网页添加了ui.bootstrap
,并尝试将LoginCtrl
更改为:
angular.module('app')
.controller('LoginCtrl', function($scope, $uibModal, UserSvc) {
...
})
但这会引发以下错误:
"Error: [$injector:unpr] Unknown provider: $templateRequestProvider <- $templateRequest <- $uibModal
导致此错误的原因是什么?在每个教程中,我发现这似乎是他们加载模块的方式,我看到的唯一区别是教程似乎没有使用路由器。
PS:请注意,如果我使用空模块列表[]
,我会得到完全相同的错误。如果我使用不存在的模块['helloworld'] I get an error
模块'helloworld'不可用'。所以我得出的结论是我的'ui.bootstrap'模块确实可用。
编辑:Plunker小提琴:http://plnkr.co/edit/FWHQ5ZDAByOWsL9YeMUH?p=preview
答案 0 :(得分:0)
答案 1 :(得分:0)
删除[&#39; ui.bootstrap&#39;]表单控制器。您应该只添加一次依赖项,但是将它添加两次,以便第二个依赖项列表覆盖第一个依赖项。
angular.module('app')
.controller('LoginCtrl', function($scope, UserSvc) {
... })
答案 2 :(得分:0)
你的路线片段看起来不对,你应该挂掉$ routeProvider时的呼叫,并且如果它没有被接收,可以将$ routeProvider声明为注入的val,例如。
<a>
答案 3 :(得分:0)
我检查了你的链接。我认为angular和ui bootstrap版本存在严重问题。在ui-boostrap仪表板中,写入 0.12.0是支持AngularJS 1.2.x的最后一个版本。我尝试了所有组合,但它不适用于您的角度版本。 我建议你将角度版本更改为最新版本和ui-bootstrap版本,以便最新版本可以使用。
请查看此工作Plukr
<script src='https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js'></script>
<script src='https://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular-route.js'></script> //change this to latest also.
<script src='https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.0.3/ui-bootstrap.min.js'></script>
<script src='./app.js'></script>
如果您只想使用角度版本。我要求你做一些R&amp; D.尝试使用不同版本的ui-bootstrap。如果它不起作用,你可以制作PR。