ฉันสามารถส่งบริการเป็นคำสั่งใน AngularJS ได้หรือไม่?

ฉันพยายามฉีดบริการลงในคำสั่งด้านล่าง:

 var app = angular.module('app',[]);
 app.factory('myData', function(){
     return {
        name : "myName"
     }
 });
 app.directive('changeIt',function($compile, myData){
    return {
            restrict: 'C',
            link: function (scope, element, attrs) {
                scope.name = myData.name;
            }
        }
 });

Unknown provider: myDataProviderแต่ตอนนี้จะกลับมาฉันข้อผิดพลาด ใครช่วยกรุณาดูที่รหัสและบอกฉันว่าฉันกำลังทำอะไรผิดหรือเปล่า?

คุณสามารถฉีดคำสั่งและดูเหมือนว่ามันจะทุกที่อื่น

app.directive('changeIt', ['myData', function(myData){
    return {
        restrict: 'C',
        link: function (scope, element, attrs) {
            scope.name = myData.name;
        }
    }
 }]);

เปลี่ยนนิยามคำสั่งของคุณจากไปapp.module app.directiveนอกเหนือจากนั้นทุกอย่างดูดี Btw คุณแทบจะไม่ต้องฉีดบริการเข้าไปในคำสั่ง หากคุณกำลังฉีดบริการ (ซึ่งมักจะเป็นแหล่งข้อมูลหรือรุ่น) ลงในคำสั่งของคุณ (ซึ่งเป็นส่วนหนึ่งของมุมมอง) คุณกำลังสร้างการมีเพศสัมพันธ์โดยตรงระหว่างมุมมองและรูปแบบของคุณ คุณต้องแยกพวกมันออกโดยต่อสายเข้าด้วยกันโดยใช้คอนโทรลเลอร์

มันทำงานได้ดี ฉันไม่แน่ใจว่าคุณกำลังทำสิ่งใดซึ่งผิด นี่คือเสียงอึกทึกของมันทำงาน

http://plnkr.co/edit/M8omDEjvPvBtrBHM84Am

คุณยังสามารถใช้บริการ $ inject เพื่อรับบริการที่คุณต้องการ ฉันพบว่ามีประโยชน์หากฉันไม่ทราบชื่อบริการล่วงหน้า แต่รู้ว่ามีส่วนต่อประสานบริการ ตัวอย่างเช่นคำสั่งที่จะเสียบตารางเข้ากับจุดสิ้นสุด ngResource หรือปุ่มลบบันทึกทั่วไปซึ่งโต้ตอบกับจุดสิ้นสุด api ใด ๆ คุณไม่ต้องการใช้คำสั่งตารางอีกครั้งสำหรับทุกคอนโทรลเลอร์หรือแหล่งข้อมูล

template.html

<div my-directive api-service='ServiceName'></div>

my-directive.directive.coffee

angular.module 'my.module'
  .factory 'myDirective', ($injector) ->
    directive = 
      restrict: 'A'
      link: (scope, element, attributes) ->
        scope.apiService = $injector.get(attributes.apiService)

ตอนนี้บริการ 'ไม่ระบุชื่อ' ของคุณพร้อมให้บริการแล้ว หากเป็นเช่น ngResource คุณสามารถใช้อินเตอร์เฟส ngResource มาตรฐานเพื่อรับข้อมูลของคุณ

ตัวอย่างเช่น:

scope.apiService.query((response) ->
  scope.data = response
, (errorResponse) ->
  console.log "ERROR fetching data for service: #{attributes.apiService}"
  console.log errorResponse.data
)

ฉันพบว่าเทคนิคนี้มีประโยชน์มากเมื่อสร้างองค์ประกอบที่โต้ตอบกับจุดสิ้นสุด API โดยเฉพาะ