Angular $injector - Angular的$timeout的未知提供者

12 浏览
0 Comments

Angular $injector - Angular的$timeout的未知提供者

我正在尝试在我的应用程序中的多个控制器中调用的方法中注入angular的$timeout服务。然而，我总是遇到以下错误：

错误：[$injector:unpr] 未知的提供者：$timeoutProvider <- >$timeout

当然，$timeout应该是已知的，因为它是一个angular服务，所以我不明白为什么会出现这个错误。

这是我的代码：

HTML:
    
JAVASCRIPT:
var app = angular.module('app', []);
app.controller('sampleController', ['$scope', function($scope) {
    var _this = this;
    $scope.doit = function() {
        var $injector = angular.injector();
        var $timeout = $injector.get('$timeout', _this);
        $timeout(function () { alert('ok'); });
    };
}]);

这是一个演示问题的jsfiddle链接：

https://jsfiddle.net/fvw8zss5/

  • 这不是关于这是否是一个不好的实践的问题。当然，这是一个不好的实践。这是关于为什么它不起作用的问题。
  • 如果你知道如何使用JsFiddle，它将可以正常工作。
0

3 答案

0 Comments

问题的原因是因为在controller的声明中没有注入$timeout服务。解决方法是将$timeout服务注入到controller的声明中。

app.controller('sampleController', ['$scope','$timeout', function($scope,$timeout) {
    // controller logic here
}]);

然而，由于这个应用程序有很多控制器（大型应用程序），在所有这些控制器中都添加这个依赖项是不可行的。更合适的方法是将这个功能转化为一个服务，并在所有控制器中注入该服务。但是，目前来说这将是一项繁重的工作。如果找不到其他解决方案，那么这将是我要做的。

app.service('timeoutService', ['$timeout', function($timeout) {
    // service logic here
}]);
app.controller('sampleController', ['$scope','timeoutService', function($scope, timeoutService) {
    // controller logic here
}]);

0
0 Comments

Angular的$injector - 未知提供者问题的原因是因为angular.injector()只能在应用程序中使用一次，而不是每个模块一次来获取注入器，并且您应该通过依赖注入来获取实例化的注入器。

解决方法是在列表中添加ng模块，这样可以通过创建新的注入器来“解决”这个问题（不推荐这样做）。

以下是解决该问题的更适当的解决方案和完整解释，请参考此答案。

我搜索和测试了大约4个小时，添加“ng”模块解决了我的问题。非常感谢！

请参考：[https://stackoverflow.com/questions/13400687](https://stackoverflow.com/questions/13400687)

0
0 Comments

Angular $injector - Unknown Provider for Angular's $timeout问题的出现的原因是在25个控制器中使用$timeout函数时，注入器无法找到对应的提供者。解决方法是通过依赖注入将$timeout函数注入到每个控制器中，或者使用$rootScope或服务来实现该功能。

下面是解决这个问题的两种方法：

方法一：使用$rootScope

在应用的根模块中添加以下代码：

angular.module('fooApp').run(['$rootScope', '$timeout', function($rootScope, $timeout) { 
    $rootScope.doit = function() {
       //在这里插入使用$timeout的函数        
    };
}]);

然后在每个控制器中注入$rootScope，即可调用$rootScope.doit()函数。

方法二：使用服务

可以创建一个服务来封装需要在25个控制器中使用的函数，并将该服务注入到每个控制器中。

首先，创建一个名为"myService"的服务，代码如下：

angular.module('fooApp').service('myService', ['$timeout', function($timeout) {
    this.doit = function() {
        //在这里插入使用$timeout的函数
    };
}]);

然后在每个控制器中注入"myService"，即可调用myService.doit()函数。

无论是使用$rootScope还是服务，为了让一个函数在25个控制器中可用，都需要进行依赖注入。使用$rootScope需要在根模块中添加代码，并在每个控制器中注入$rootScope。而使用服务则需要创建一个封装函数的服务，并在每个控制器中注入该服务。根据个人偏好和应用的架构，选择合适的方法来解决问题。

0