Question

我正在使用如下的js文件。

(function(){

    angular.module("MyModule",[])
    .service('testService',testService)
    .directive("testDirective",testDirective);;

    function testDirective(testService){
         var directive = {
          template: '<input type="text">',
          restrict: 'EA'
        };
        return directive;
    }

    function testService($scope){
        $scope.name = "testName";
    }

}())

当我加载页面时，我收到如下错误。

错误：[$ injector：unpr]未知提供者：$ scopeProvider＆lt; - $ scope＆lt; - inputResourceService＆lt; - inputResourceDirective

请帮我解决这个问题。

Answer 1

服务函数
中永远不会有
$scope依赖项

您应该在服务中创建一个可以在所有角度组件之间轻松共享的变量

(function(){

    angular.module("MyModule",[])
    .service('testService',testService)
    .directive("testDirective",testDirective);;

    function testDirective(testService){
         var directive = {
          template: '<input type="text" ng-model="something">',
          restrict: 'EA',
          link: function(scope, element, attrs){
              scope.name = testService.name; //assigned service variable value to scope
          }
        };
        return directive;
    }

    function testService(){
        var testService = {}
        testService.name = "testName";
        return testService;
    }

}())

Working Plunkr

Answer 2

我认为你不能在服务中使用这样的范围。我会说服务的行为有点像Java中的类，所以你可以从控制器调用它的方法。

我不知道您的怀疑是否比您所显示的更复杂，但您可以像这样重写此代码：

(function(){

angular.module("MyModule",[])
.directive("testDirective",testDirective);

function testDirective(testService){
     var directive = {
      template: '<input type="text">',
      restrict: 'EA',
      controller: function ($scope) {
          $scope.name = 'testName';
      }
    };
    return directive;
}

}())

使用指令的控制器而不是服务。

Answer 3

该服务无法提供

$scope服务。如果您确实需要$scope，则可以改为使用$rootScope：

 (function(){

    angular.module("MyModule",[])
    .service('testService',testService)
    .directive("testDirective",testDirective);;

    function testDirective(testService){
         var directive = {
          template: '<input type="text">',
          restrict: 'EA'
        };
        return directive;
    }

    function testService($rootScope){
        $scope.name = "testName";
    }

}())

但是，在服务中注入$scope或$rootScope没有任何意义。

$ scopeProvider问题

3 个答案: