আমি কি AngularJS এ কোনও নির্দেশিকাতে কোনও পরিষেবা ইনজেক্ট করতে পারি?

Question

আমি নীচের মতো কোনও নির্দেশকে কোনও পরিষেবা ইনজেকশনের চেষ্টা করছি:

 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। কেউ দয়া করে কোডটি সন্ধান করে আমাকে বলতে পারেন যে আমি কিছু ভুল করছি?

Answer 1

আপনি নির্দেশিকাগুলিতে ইঞ্জেকশন করতে পারেন এবং এটি অন্য কোথাও দেখতে যেমন লাগে।

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

Comments

আমি মনে করি এটি একটি আরও ভাল সমাধান কারণ এটি আপনার কোডটি খাঁচানোর পরেও কাজ করে।

— czerasz

আমাকে ফিরে আসার আগে '_myData = myData' যোগ করতে হয়েছিল এবং তারপরে লিংক ফাংশনের অভ্যন্তরে _myData হিসাবে অবজেক্টটি উল্লেখ করতে হয়েছিল।

— জেলিং

ধন্যবাদ @ জেলিং আমাকেও একই কাজ করতে হয়েছিল। আমি ভাবছি যদি সেখানে কেউ আমাদের বলতে পারে তবে কেন ...?

— sfletche

ইনজেকশনের কোনও বিশেষ কারণ the নির্দেশনায় সংকলন করা? এটি কোথাও ব্যবহার করা হবে বলে মনে হয় না।

— gru

আপনি যদি ডাইরেক্টিভ কলের বাইরে লিঙ্ক ফাংশন তৈরি করতে চান তবে ইনজেকশনের কোনও সমাধান আছে?

— থিঙ্কবোনো

Answer 2

থেকে আপনার নির্দেশ সংজ্ঞা পরিবর্তন app.moduleকরার জন্য app.directive। তা ছাড়া সবকিছু ঠিক আছে বলে মনে হচ্ছে। বিটিডব্লিউ, খুব কমই আপনাকে কোনও নির্দেশিকাতে কোনও পরিষেবা ইনজেক্ট করতে হবে। আপনি যদি কোনও নির্দেশকে ইনজেকশন দিচ্ছেন (যা সাধারণত কোনও ডেটা উত্স বা মডেল হয়) আপনার নির্দেশিকায় (যা কোনও দৃষ্টির একধরণের অংশ) তবে আপনি নিজের দৃষ্টিভঙ্গি এবং মডেলের মধ্যে সরাসরি সংযোগ তৈরি করছেন। একটি কন্ট্রোলার ব্যবহার করে আপনি তাদের একসাথে তারের মাধ্যমে তাদের আলাদা করতে হবে।

এটা ঠিক কাজ করে। আমি নিশ্চিত নই যে আপনি কী করছেন যা ভুল। এখানে এটি কাজ করে একটি অংশ।

http://plnkr.co/edit/M8omDEjvPvBtrBHM84Am

Comments

আপনি একটি উদাহরণ প্রদান করতে পারেন দয়া করে

— ব্যতিক্রম

@ এক্সসেপশন আপনি কি নিজের কোডটি কোনও ফ্রিডলে রাখতে পারবেন? আমি দেখতে পেয়েছি এবং আপনার কোডটি কেন কাজ করছে না তা দেখতে এবং সম্ভবত আপনি এটি ঠিক করতে সহায়তা করতে পারেন।

— গণরাজ

@ এক্সসেপশন একটি কার্যকরী নিমজ্জন যোগ করেছে যা কোডটি কাজ করে দেখায়।

— গণরাজ

আমি সবেমাত্র কিছু আবিষ্কার করেছি: আপনি যদি ফাংশন প্যারামিটারগুলিতে কোনও ইঞ্জেকশনটি সংজ্ঞায়িত করেন function($location) { ...তবে আসলে $locationফাংশনের অভ্যন্তরে উল্লেখ না করেন, AngularJS ইঞ্জেকশনটি সম্পাদন করবে না। আপনি একবারে কখনই এই আচরণটি লক্ষ্য করবেন তা ডিবাগারের মধ্যে রয়েছে।

— ওয়াল্টার স্ট্যাবোসজ

আমি নিশ্চিত নই যে আমি আপনার "মিলিত" মন্তব্যের সাথে একমত agree আমরা ইতিমধ্যে বিশ্বব্যাপী নিয়ামক এবং পরিষেবা দম্পতি - আমরা প্রগ্রেমেটিক্যালি রানটাইম সময়ে পরিষেবার বাস্তবায়ন প্রতিস্থাপন করতে পারবেন না। যার অর্থ একটি একক নিয়ামক একটি একক পরিষেবা পান। তবে - নির্দেশাবলী পৃষ্ঠায় প্রতিটি ট্যাগ প্রতি কনফিগারেশন বিচ্ছিন্ন করেছে, তাই আমরা সম্ভাব্যভাবে বিভিন্ন নির্দেশিকা উদাহরণগুলিতে পৃথক পরিষেবা সক্ষম করে থাকি। আমার কাছে মনে হয় এটি কম decoupled।

— লোক মোগ্রাবি

Answer 3

আপনি নিজের পছন্দমতো পরিষেবা পেতে $ ইনজেকশন পরিষেবাটিও ব্যবহার করতে পারেন। আমি যদি সেই সময়ের আগে পরিষেবার নামটি না জানি তবে পরিষেবা ইন্টারফেসটি জানি তবে আমি এটি দরকারী মনে করি। উদাহরণস্বরূপ এমন একটি নির্দেশ যা কোনও টেবিলটিকে এনজিআরসোর্স শেষ বিন্দুতে বা জেনেরিক মুছুন-রেকর্ড বোতামে প্লাগ করবে যা কোনও এপিআই শেষ পয়েন্টের সাথে ইন্টারেক্ট করে। আপনি প্রতিটি নিয়ামক বা ডেটা-উত্সের জন্য সারণী নির্দেশকে পুনরায় প্রয়োগ করতে চান না।

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)

এখন আপনার 'বেনামে' পরিষেবা সম্পূর্ণ উপলব্ধ। যদি এটি এনজিআরসোর্স উদাহরণস্বরূপ হয় তবে আপনি আপনার ডেটা পাওয়ার জন্য স্ট্যান্ডার্ড এনজিআরসোর্স ইন্টারফেসটি ব্যবহার করতে পারেন

উদাহরণ স্বরূপ:

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

বিশেষত এপিআই এন্ডপয়েন্টগুলির সাথে ইন্টারেক্ট করে এমন উপাদান তৈরি করার সময় আমি এই কৌশলটি খুব দরকারী বলে খুঁজে পেয়েছি।