AngularJS，将服务作为指令属性传递[未定义]

Question

我是AngularJS新手，我很难将一个服务作为一个属性传递给一个指令，人们认为我以前做过几次这样的操作，但是这一次我得到了服务返回值的“未定义”。

这是我的密码

directive.js

'use strict';

/*global d3:false */

angular.module('myApp')
  .directive('stogbars', function() {


    return {
      restrict: 'E',
      scope: {
        service: '=service'
      },
      template: '<div id="stogbars"></div>',
      link: function(scope) {

        scope.$watch(service.data,function(){
          //my treatment (scope.service ---> undefined)
        });
      }

    };
  });

html页面：

<div class="rgo-data-widget box-6">
  <div class="inner-box">
    <h3 class="inner-box-title">Title Goes Here</h3>
    <div class="box-module">
      <div class="stogbars-box">                    
          <stogbars service = theService></stogbars>
      </div><!-- stogbars -->
    </div><!-- box module -->
  </div><!-- inner box -->
</div><!-- widget -->

我不能发布服务代码，因为它是一个700行文件。谢谢你的帮助。

Answer 1

你把那个服务注射到你的控制器里了吗？

只有当相应的控制器在作用域中有该服务的引用时，给定的html才能工作。

首先，将服务注入控制器，然后尝试

$scope.theService = theService;

在你的控制器里。

Answer 2

您是否尝试过在HTML中消除空白：

 <stogbars service="theService"></stogbars>