$ scopeProvider的问题

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 <-$ scope <-inputResourceService <-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;
    }

}())

工作朋克

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没有任何意义。