添加服务控制器时，未知提供商 [英] Unknown Provider when adding service to controller
问题描述
我创建了一个模态的服务，当我注射服务到控制器中，我收到了，说：$注射器：unpr未知提供商的错误。这里是我的低于code。让我知道如果我失去了一些东西。
这是服务我有这么远。</ STRONG>
使用严格的;angular.module（'myApp.services'，[]）.factory（'modalService'，['$范围'，函数（$范围）{
返回{
openMenuModal：功能（templateLink，windowAnimation）{
VAR modalInstance = $ modal.open（{
templateUrl：templateLink，
背景：静态，
windowClass：windowAnimation，
控制器：函数（$范围，$ modalInstance）{
$ scope.close =功能（）{
$ modalInstance.close（）;
};
}，
大小：'MD'，
适用范围：$范围，
键盘：真
}）; }
};}]）;
这里是我已经设置了控制器。
angular.module（'myApp.controllers'，['ui.bootstrap'，'ngAnimate']）
.controller（'HomeCtrl'，函数（$范围，$ HTTP，$莫代尔，modalService）{
$ scope.opentheBook = modalService.openMenuModal（'谐音/ Books.html，动画zoomIn'）;
}）;
下面是在模态数据模板 - Books.html
＆LT; DIV NG控制器=HomeCtrl＆GT;
＆LT; DIV CLASS =modalBox动画淡入＆GT;
＆LT;按钮类=BTN BTN-危险右拉式类型=按钮NG点击=提示=关闭＆GT;＆LT; I类=发发次＆GT;＆LT; / I＆GT; ＆LT; /按钮＆GT;
＆LT; H1＆GT;标题＆LT; / H1＆GT;
＆所述p为H.;描述＆下; / P＆GT;
＆LT; DIV CLASS =下一步＆GT;
＆LT;按钮类=BTN BTN-危险右拉式TYPE =按钮提示=关闭＆GT;＆LT; I类=发发次＆GT;＆LT; / I＆GT;＆LT; /按钮＆GT;
＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
这里是我调用的OpenBook（）与来自JSON
的信息打开模态主网页 ＆LT; DIV CLASS =书籍＆GT;
＆LT; UL＆GT;
＆LT;李NG重复=书thing.Books级=列表的无样式＆GT;＆LT;一个NG点击=opentheBook的href =＃＆GT;＆LT; H6＆GT; {{book.name} }＆LT; / H6＆GT;＆LT; / A＆GT;＆LT; /李＆GT;
＆LT; / UL＆GT;
＆LT; / DIV＆GT;
JSON图书为例--inside另一个数组称为事情
书：[
{
名：书1名
说明：约书说明......
}，
{
名：书2名
说明：约书说明......
}
]
从 $注射器这个错误结果暂时无法解决需要依赖。为了解决这个问题，确保依赖的定义和正确拼写例如，下面的code将失败，您收到同样的错误 - $喷油器。unpr ，如果为myService没有定义：
angular.module（'对myApp'，[]）
.controller（'myController的'，['为myService'，函数（为myService）{
//使用为myService东西
}]）;
确保每个扶养人是指将解决这个问题，如下所述。
angular.module（'对myApp'，[]）
。服务（'为myService'，函数（）{/ * ... * /}）
.controller（'myController的'，['为myService'，函数（为myService）{
//使用为myService东西
}]）;
因此，要回答你的问题，你的情况，你似乎缺少依赖
angular.module（'myApp.controllers'，['ui.bootstrap'，'ngAnimate']）
.controller（'HomeCtrl'，函数（$范围，$ HTTP，$莫代尔，modalService）{
$ scope.opentheBook = modalService.openMenuModal（'谐音/ Books.html，动画zoomIn'）;
}）;
要注入 modalService 像这样：
.controller（'HomeCtrl'，['modalService'，函数（$范围，$ HTTP，$莫代尔，modalService）{ }]）;
您还需要你的工厂模块更改到 angular.module（'myApp.services'，['ui.bootstrap']） ，并使用 $ uibModal ，因为 $模式是pcated德$ p $
angular.module（'对myApp'，['ui.bootstrap']）.factory（'modalService'，['$ uibModal'，函数（$ uibModal）{ 返回{
openMenuModal：功能（templateLink，windowAnimation）{ VAR modalObj = $ uibModal.open（{
templateUrl：templateLink，
背景：静态，
windowClass：windowAnimation，
控制器：函数（$范围，$ modalInstance）{
$ scope.ok =功能（ID）{
//处理OK按钮单击
$ modalInstance.close（）;
}，
$ scope.cancel =功能（）{
$ modalInstance.dismiss（'取消'）;
}
}，
大小：'MD'，
键盘：真实，
解析：{
someData：功能（）{
返回'返回一些数据';
}
}
}）;
}
};
}]）.controller（'HomeCtrl'，['$范围，modalService'，函数（$范围，modalService，someData）{
$ scope.dataFromService = someData;
$ scope.opentheBook =功能（）{
modalService.openMenuModal（'myModalContent.html'，'动画zoomIn'）;
};
}]）;
更新1
正如评论中提到，不要试图注入 $范围给工厂。下面是我创建了一个Plunker它可以让你通过调用工厂打开一个模式。
http://plnkr.co/edit/G68NVYZlTqrIS0N2TKL4
I created a Modal service and when I injected the service into the controller, I am receiving an error that says "$Injector: unpr Unknown Provider". Here is my code below. Let me know if I am missing something.
This is the service I have so far.
'use strict';
angular.module('myApp.services', [])
.factory('modalService', ['$scope', function($scope) {
return {
openMenuModal: function(templateLink, windowAnimation) {
var modalInstance = $modal.open({
templateUrl: templateLink,
backdrop: 'static',
windowClass: windowAnimation,
controller: function($scope, $modalInstance) {
$scope.close = function() {
$modalInstance.close();
};
},
size: 'md',
scope: $scope,
keyboard: true
});
}
};
}]);
Here is the controller I have set up.
angular.module('myApp.controllers', ['ui.bootstrap', 'ngAnimate'])
.controller('HomeCtrl', function($scope, $http, $modal, modalService) {
$scope.opentheBook = modalService.openMenuModal('partials/Books.html', 'animated zoomIn');
});
Here is the template for the data in the modal - Books.html
<div ng-controller="HomeCtrl">
<div class="modalBox animated fadeIn">
<button class="btn btn-danger pull-right" type="button" ng-click="" tooltip="Close"><i class="fa fa-times"></i></button>
<h1>title</h1>
<p>description</p>
<div class="next">
<button class="btn btn-danger pull-right" type="button" tooltip="Close"><i class="fa fa-times"></i></button>
</div>
</div>
</div>
Here is the main home page where I am calling the openBook() to open the modal with the info from the json
<div class="Books">
<ul>
<li ng-repeat="book in thing.Books" class="list-unstyled"><a ng-click="opentheBook" href="#"><h6>{{book.name}}</h6></a></li>
</ul>
</div>
json for Books example --inside another array called things
"Books": [
{
"name": "Name of Book 1",
"description": "Description about book..."
},
{
"name": "Name of Book 2",
"description": "Description about book..."
}
]
This error results from the $injector being unable to resolve a required dependency. To fix this, make sure the dependency is defined and spelled correctly. For example, the following code will fail with the same error you received -$injector:unpr, if myService is not defined:
angular.module('myApp', [])
.controller('MyController', ['myService', function (myService) {
// Do something with myService
}]);
Making sure each dependency is defined will fix the problem, as noted below.
angular.module('myApp', [])
.service('myService', function () { /* ... */ })
.controller('MyController', ['myService', function (myService) {
// Do something with myService
}]);
So to answer your question, in your case you appear to be missing dependency
angular.module('myApp.controllers', ['ui.bootstrap', 'ngAnimate'])
.controller('HomeCtrl', function($scope, $http, $modal, modalService) {
$scope.opentheBook = modalService.openMenuModal('partials/Books.html', 'animated zoomIn');
});
To Inject modalService like so:
.controller('HomeCtrl', ['modalService', function($scope, $http, $modal, modalService) {
}]);
You also need to change up your factory module to angular.module('myApp.services', ['ui.bootstrap']) and use $uibModal since $modal is deprecated.
angular.module('myApp', ['ui.bootstrap'])
.factory('modalService', ['$uibModal', function($uibModal) {
return {
openMenuModal: function(templateLink, windowAnimation) {
var modalObj = $uibModal.open({
templateUrl: templateLink,
backdrop: 'static',
windowClass: windowAnimation,
controller: function($scope,$modalInstance){
$scope.ok = function(id){
//Process OK Button Click
$modalInstance.close();
},
$scope.cancel = function(){
$modalInstance.dismiss('cancel');
}
},
size: 'md',
keyboard: true,
resolve: {
someData: function () {
return 'Return some Data';
}
}
});
}
};
}])
.controller('HomeCtrl', ['$scope','modalService', function($scope, modalService, someData) {
$scope.dataFromService = someData;
$scope.opentheBook = function(){
modalService.openMenuModal('myModalContent.html', 'animated zoomIn');
};
}]);
UPDATE 1
As mentioned in the comments, do not attempt to inject $scope to your factory. Here is a Plunker I created which lets you open a modal by calling the factory.
http://plnkr.co/edit/G68NVYZlTqrIS0N2TKL4
这篇关于添加服务控制器时，未知提供商的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
