টিএল; ডিআর
1) আপনি যখন কারখানাটি ব্যবহার করেন আপনি কোনও বস্তু তৈরি করেন, এতে বৈশিষ্ট্য যুক্ত করুন, তারপরে একই জিনিসটি ফিরিয়ে দিন। আপনি যখন এই ফ্যাক্টরিটিকে আপনার নিয়ামকের মধ্যে পাস করেন তখন অবজেক্টের সেই বৈশিষ্ট্যগুলি এখন আপনার কারখানার মাধ্যমে সেই নিয়ামকটিতে উপলব্ধ।
app.controller(‘myFactoryCtrl’, function($scope, myFactory){
$scope.artist = myFactory.getArtist();
});
app.factory(‘myFactory’, function(){
var _artist = ‘Shakira’;
var service = {};
service.getArtist = function(){
return _artist;
}
return service;
});
২) আপনি যখন পরিষেবাটি ব্যবহার করছেন , তখন কৌণিক জেএস 'নতুন' কীওয়ার্ড দিয়ে পর্দার আড়ালে তা ইনস্ট্যান্ট করে। তার কারণে, আপনি 'এটি'-তে বৈশিষ্ট্য যুক্ত করবেন এবং পরিষেবাটি' এটি 'ফেরত দেবে। আপনি যখন পরিষেবাটি আপনার নিয়ামকের মধ্যে পাস করেন, 'এই' এর এই বৈশিষ্ট্যগুলি এখন আপনার পরিষেবার মাধ্যমে সেই নিয়ামকটিতে উপলভ্য হবে।
app.controller(‘myServiceCtrl’, function($scope, myService){
$scope.artist = myService.getArtist();
});
app.service(‘myService’, function(){
var _artist = ‘Nelly’;
this.getArtist = function(){
return _artist;
}
});
3) সরবরাহকারীরা হ'ল একমাত্র পরিষেবা যা আপনি আপনার .config () ফাংশনে যেতে পারেন। আপনি যখন পরিষেবা পরিষেবা উপলব্ধ করার আগে মডিউল-ওয়াইড কনফিগারেশন সরবরাহ করতে চান তখন কোনও সরবরাহকারীর ব্যবহার করুন।
app.controller(‘myProvider’, function($scope, myProvider){
$scope.artist = myProvider.getArtist();
$scope.data.thingFromConfig = myProvider.thingOnConfig;
});
app.provider(‘myProvider’, function(){
//Only the next two lines are available in the app.config()
this._artist = ‘’;
this.thingFromConfig = ‘’;
this.$get = function(){
var that = this;
return {
getArtist: function(){
return that._artist;
},
thingOnConfig: that.thingFromConfig
}
}
});
app.config(function(myProviderProvider){
myProviderProvider.thingFromConfig = ‘This was set in config’;
});
নন টিএল; ডিআর
1) কারখানা
কারখানাগুলি কোনও পরিষেবা তৈরি এবং কনফিগার করার সর্বাধিক জনপ্রিয় উপায়। টিএল যা বলেছিল তার চেয়ে সত্য আর কিছুই নেই; আপনি কেবল একটি অবজেক্ট তৈরি করুন, এতে বৈশিষ্ট্য যুক্ত করুন, তারপরে একই জিনিসটি ফিরিয়ে দিন। তারপরে আপনি যখন কারখানাটি আপনার নিয়ামকের মধ্যে পাস করবেন তখন অবজেক্টের সেই বৈশিষ্ট্যগুলি এখন আপনার কারখানার মাধ্যমে সেই নিয়ামকটিতে উপলব্ধ। আরও বিস্তৃত উদাহরণ নীচে।
app.factory(‘myFactory’, function(){
var service = {};
return service;
});
এখন আমরা 'পরিষেবাদি'র সাথে সংযুক্ত থাকা যে কোনও বৈশিষ্ট্য আমাদের কন্ট্রোলারে' মাইফ্যাক্টরি 'পাস করার পরে আমাদের জন্য উপলব্ধ থাকবে।
এখন আমাদের কলব্যাক ফাংশনে কিছু 'প্রাইভেট' ভেরিয়েবল যুক্ত করা যাক। এগুলি সরাসরি নিয়ামকের কাছ থেকে অ্যাক্সেসযোগ্য হবে না, তবে আমরা প্রয়োজনে এই 'ব্যক্তিগত' ভেরিয়েবলগুলিকে পরিবর্তন করতে সক্ষম হতে শেষ পর্যন্ত 'পরিষেবা' তে কিছু গেটর / সেটার পদ্ধতি সেট করব।
app.factory(‘myFactory’, function($http, $q){
var service = {};
var baseUrl = ‘https://itunes.apple.com/search?term=’;
var _artist = ‘’;
var _finalUrl = ‘’;
var makeUrl = function(){
_artist = _artist.split(‘ ‘).join(‘+’);
_finalUrl = baseUrl + _artist + ‘&callback=JSON_CALLBACK’;
return _finalUrl
}
return service;
});
এখানে আপনি লক্ষ্য করবেন যে আমরা সেই ভেরিয়েবলগুলি / ফাংশনটিকে 'পরিষেবার' সাথে সংযুক্ত করছি না। আমরা পরে এগুলি ব্যবহার বা সংশোধন করার জন্য কেবল এগুলি তৈরি করছি।
- আইটিউনস এপিআই-র প্রয়োজনীয় বেস ইউআরএল API
- _আর্টিস্ট হলেন সেই শিল্পী যা আমরা দেখতে চাই
- _ফাইনাল ইউআরএল চূড়ান্ত এবং সম্পূর্ণরূপে নির্মিত URL যা আমরা আইটিউনসে কল করব
- মেকআরএল এমন একটি ফাংশন যা আমাদের আইটিউনস বন্ধুত্বপূর্ণ ইউআরএল তৈরি এবং ফিরিয়ে আনবে।
এখন যেহেতু আমাদের সহায়ক / ব্যক্তিগত ভেরিয়েবল এবং ফাংশনটি রয়েছে, আসুন 'পরিষেবা' অবজেক্টে কিছু বৈশিষ্ট্য যুক্ত করুন। আমরা 'পরিষেবা' যাই থাকি না কেন আমরা যে কোনও নিয়ামককে 'মাইফ্যাক্টরি' দিয়ে যাব তার ভিতরে সরাসরি ব্যবহার করা যেতে পারে।
আমরা সেটআরটিস্ট এবং getArtist পদ্ধতি তৈরি করতে যা যা কেবল শিল্পীকে ফিরে আসে বা সেট করে। আমরা এমন একটি পদ্ধতি তৈরি করতে যাচ্ছি যা আমাদের তৈরি ইউআরএল দিয়ে আইটিউনস এপিআই কল করবে। এই পদ্ধতিটি এমন প্রতিশ্রুতি ফেরত যাচ্ছে যা আইটিউনস এপিআই থেকে ডেটা ফিরে আসার পরে পূরণ করবে fulfill অ্যাঙ্গুলারজেএস-এ প্রতিশ্রুতি ব্যবহার করার মতো অভিজ্ঞতা যদি আপনার না হয় তবে আমি তাদের প্রতি গভীর ডুব দেওয়ার পরামর্শ দিচ্ছি।
নীচে সেটআর্টিস্ট একজন শিল্পীকে গ্রহণ করে এবং আপনাকে শিল্পী সেট করার অনুমতি দেয়। getArtist শিল্পীকে ফিরিয়ে দেয়। callItunes প্রথম আদেশ URL টি আমরা আমাদের $ HTTP অনুরোধের সাথে ব্যবহার করব নির্মাণ করার জন্য makeUrl () কল। তারপরে এটি একটি প্রতিশ্রুতি অবজেক্ট সেট আপ করে, আমাদের চূড়ান্ত ইউআরএল দিয়ে একটি request HTTP অনুরোধ করে, তারপরে যেহেতু $ http কোনও প্রতিশ্রুতি ফিরিয়ে দেয়, আমরা আমাদের অনুরোধের পরে .success বা .error কল করতে সক্ষম হয়েছি। তারপরে আমরা আইটিউনস ডেটা দিয়ে আমাদের প্রতিশ্রুতিটি সমাধান করি, বা আমরা 'একটি ত্রুটি হয়েছিল' এমন বার্তা দিয়ে তা প্রত্যাখ্যান করি।
app.factory('myFactory', function($http, $q){
var service = {};
var baseUrl = 'https://itunes.apple.com/search?term=';
var _artist = '';
var _finalUrl = '';
var makeUrl = function(){
_artist = _artist.split(' ').join('+');
_finalUrl = baseUrl + _artist + '&callback=JSON_CALLBACK'
return _finalUrl;
}
service.setArtist = function(artist){
_artist = artist;
}
service.getArtist = function(){
return _artist;
}
service.callItunes = function(){
makeUrl();
var deferred = $q.defer();
$http({
method: 'JSONP',
url: _finalUrl
}).success(function(data){
deferred.resolve(data);
}).error(function(){
deferred.reject('There was an error')
})
return deferred.promise;
}
return service;
});
এখন আমাদের কারখানাটি সম্পূর্ণ। আমরা এখন যে কোনও কন্ট্রোলারে 'মাইফ্যাক্টরি' ইনজেক্ট করতে সক্ষম হয়েছি এবং তারপরে আমরা আমাদের পদ্ধতিগুলিকে কল করতে সক্ষম হব যা আমরা আমাদের পরিষেবা অবজেক্টের সাথে সংযুক্ত করেছি (সেটআর্টিস্ট, গেটআর্টিস্ট, এবং কলআইটিউনস)।
app.controller('myFactoryCtrl', function($scope, myFactory){
$scope.data = {};
$scope.updateArtist = function(){
myFactory.setArtist($scope.data.artist);
};
$scope.submitArtist = function(){
myFactory.callItunes()
.then(function(data){
$scope.data.artistData = data;
}, function(data){
alert(data);
})
}
});
উপরের কন্ট্রোলারে আমরা 'মাইফ্যাক্টরি' পরিষেবাতে ইনজেকশন দিচ্ছি। তারপরে আমরা 'মাইফ্যাক্টরি' থেকে ডেটা সহ আমাদের $ স্কোপ অবজেক্টে বৈশিষ্ট্য সেট করি। উপরের একমাত্র কূটকীয় কোডটি হ'ল যদি আপনি এর আগে প্রতিশ্রুতিগুলির সাথে আচরণ না করেন। কল আইটিউনস কোনও প্রতিশ্রুতি ফিরিয়ে দিচ্ছে, তাই আমরা আইটিউনস ডেটা দিয়ে আমাদের প্রতিশ্রুতি পূরণ হওয়ার পরে। () পদ্ধতিটি ব্যবহার করতে সক্ষম হয়েছি এবং কেবলমাত্র স্কটি.ডাটা.আর্টিস্টডেটা সেট করব। আপনি দেখতে পাবেন যে আমাদের নিয়ামকটি খুব 'পাতলা' (এটি একটি ভাল কোডিং অনুশীলন)। আমাদের সমস্ত যুক্তিযুক্ত এবং অবিচলিত ডেটা আমাদের পরিষেবাতে অবস্থিত, আমাদের নিয়ামকের মধ্যে নয়।
2) পরিষেবা
কোনও পরিষেবা তৈরি করার সময় সবচেয়ে বড় জিনিসটি হ'ল এটি 'নতুন' কীওয়ার্ড দিয়ে ইনস্ট্যান্ট করা। আপনার জাভাস্ক্রিপ্ট গুরুগুলির জন্য এটি আপনাকে কোডের প্রকৃতির একটি বড় ইঙ্গিত দেবে। আপনারা জাভাস্ক্রিপ্টের সীমিত পটভূমিতে বা যারা 'নতুন' কীওয়ার্ডটি আসলে কী করেন তার সাথে খুব বেশি পরিচিত নন, তাদের জন্য কিছু জাভাস্ক্রিপ্ট মূলসূত্রগুলি পর্যালোচনা করুন যা পরিশেষে কোনও পরিষেবার প্রকৃতি বুঝতে আমাদের সহায়তা করবে।
আপনি যখন 'নতুন' কীওয়ার্ডের সাহায্যে কোনও ফাংশনটি আহ্বান করবেন তখন সত্যিই ঘটে যাওয়া পরিবর্তনগুলি দেখতে, আসুন একটি ফাংশন তৈরি করি এবং এটি 'নতুন' কীওয়ার্ডের সাহায্যে প্রার্থনা করি, তারপরে দোভাষী কীভাবে এটি 'নতুন' কীওয়ার্ডটি দেখেন তা দেখান। শেষ ফলাফল উভয়ই এক হবে।
প্রথমে আমাদের কনস্ট্রাক্টর তৈরি করা যাক।
var Person = function(name, age){
this.name = name;
this.age = age;
}
এটি একটি সাধারণ জাভাস্ক্রিপ্ট কনস্ট্রাক্টর ফাংশন। এখন যখনই আমরা 'নতুন' কীওয়ার্ড ব্যবহার করে ব্যক্তি ফাংশনটি শুরু করব তখনই 'এটি' সদ্য নির্মিত বস্তুর সাথে আবদ্ধ থাকবে।
এখন আসুন আমরা আমাদের ব্যক্তির প্রোটোটাইপটিতে একটি পদ্ধতি যুক্ত করি যাতে এটি আমাদের ব্যক্তি 'শ্রেণি'র প্রতিটি উদাহরণে উপলব্ধ।
Person.prototype.sayName = function(){
alert(‘My name is ‘ + this.name);
}
এখন, যেহেতু আমরা প্রোটোটাইপের উপর sayName ফাংশনটি রেখেছি, ততক্ষণ প্রতিটি ব্যক্তির সেই উদাহরণটির নাম সতর্কতার জন্য sayName ফাংশনটি কল করতে সক্ষম হবে।
এখন যেহেতু আমাদের পার্সোন কনস্ট্রাক্টর ফাংশন এবং এর প্রোটোটাইপে আমাদের sayName ফাংশন রয়েছে, আসুন প্রকৃতপক্ষে ব্যক্তির একটি উদাহরণ তৈরি করি তারপরে sayName ফাংশনটি কল করি।
var tyler = new Person(‘Tyler’, 23);
tyler.sayName(); //alerts ‘My name is Tyler’
সুতরাং সমস্ত একসাথে একজন ব্যক্তির কনস্ট্রাক্টর তৈরির জন্য কোড, এর প্রোটোটাইপটিতে একটি ফাংশন যুক্ত করে, একজন ব্যক্তি উদাহরণ তৈরি করে এবং তার প্রোটোটাইপে ফাংশনটি কল করার পরে এটি দেখতে এরকম দেখাচ্ছে।
var Person = function(name, age){
this.name = name;
this.age = age;
}
Person.prototype.sayName = function(){
alert(‘My name is ‘ + this.name);
}
var tyler = new Person(‘Tyler’, 23);
tyler.sayName(); //alerts ‘My name is Tyler’
এখন আপনি জাভাস্ক্রিপ্টে 'নতুন' কীওয়ার্ডটি ব্যবহার করার সময় আসলে কী ঘটছে তা দেখুন। প্রথম যে বিষয়টি আপনার লক্ষ্য করা উচিত তা হ'ল আমাদের উদাহরণে 'নতুন' ব্যবহার করার পরে, আমরা 'টাইলার'-তে কোনও পদ্ধতি (sayName) কল করতে সক্ষম হলাম যেমন এটি কোনও বস্তু - কারণ এটি। সুতরাং প্রথমে, আমরা জানি যে আমাদের পার্সোন কনস্ট্রাক্টর একটি বস্তু ফিরিয়ে দিচ্ছে, আমরা কোডটিতে তা দেখতে পারি কিনা। দ্বিতীয়ত, আমরা জানি যেহেতু আমাদের sayName ফাংশনটি প্রোটোটাইপের উপর অবস্থিত এবং সরাসরি ব্যক্তি উদাহরণে নয়, ব্যক্তি ফাংশনটি যে বস্তুটি ফিরিয়ে দিচ্ছে তা অবশ্যই ব্যর্থ অনুসন্ধানগুলিতে তার প্রোটোটাইপকে অর্পণ করতে হবে। আরও সহজ শর্তে, আমরা যখন টাইলারসেসনেম () ডাকি তখন অনুবাদক বলেন, "ঠিক আছে, আমি 'টিলার' অবজেক্টটি সন্ধান করব যা আমরা সবে তৈরি করেছি, সেনেম ফাংশনটি সন্ধান করব, তারপরে এটিকে কল করব। এক মিনিট অপেক্ষা করুন, আমি এখানে এটি দেখতে পাচ্ছি না - আমি যা দেখি তা হ'ল নাম এবং বয়স, আমাকে প্রোটোটাইপ পরীক্ষা করতে দিন হ্যাঁ, মনে হচ্ছে এটি প্রোটোটাইপে রয়েছে, আমাকে এটি কল করতে দিন।
'নতুন' কীওয়ার্ডটি আসলে জাভাস্ক্রিপ্টে কী করছে সে সম্পর্কে আপনি কীভাবে ভাবতে পারেন তার নীচে কোডটি রয়েছে। এটি মূলত উপরের অনুচ্ছেদের একটি কোড উদাহরণ। আমি 'ইন্টারপ্রিটার ভিউ' বা নোটের ভিতরে দোভাষী যেভাবে কোডটি দেখি সেভাবে রেখেছি।
var Person = function(name, age){
//The below line creates an object(obj) that will delegate to the person’s prototype on failed lookups.
//var obj = Object.create(Person.prototype);
//The line directly below this sets ‘this’ to the newly created object
//this = obj;
this.name = name;
this.age = age;
//return this;
}
জাভাস্ক্রিপ্টে 'নতুন' কীওয়ার্ডটি আসলে কী করে সে সম্পর্কে এই জ্ঞান থাকা, AngularJS- এ একটি পরিষেবা তৈরি করা বোঝা সহজ হওয়া উচিত।
কোনও পরিষেবা তৈরি করার সময় সবচেয়ে বড় বিষয়টি বুঝতে হবে যে পরিষেবাগুলি 'নতুন' কীওয়ার্ড দিয়ে ইনস্ট্যান্ট হয়। উপরের আমাদের উদাহরণগুলির সাথে সেই জ্ঞানের সংমিশ্রণ করা, আপনাকে এখন স্বীকৃতি দেওয়া উচিত যে আপনি নিজের সম্পত্তি এবং পদ্ধতিগুলি সরাসরি 'এটি'র সাথে সংযুক্ত করছেন যা পরে পরিষেবা থেকেই ফিরে আসবে। এর এটিকে এক নজরে দেখি।
আমরা কারখানার উদাহরণ দিয়ে মূলত যা করেছি তার বিপরীতে, আমাদের কোনও বস্তু তৈরি করার দরকার নেই তারপরে সেই বস্তুটি ফিরিয়ে আনতে হবে কারণ যেমনটি এর আগেও বহুবার উল্লিখিত হয়েছিল, আমরা 'নতুন' কীওয়ার্ডটি ব্যবহার করেছি যাতে দোভাষী সেই অবজেক্টটি তৈরি করে, তার কাছে এটি অর্পণ করা হয় এটি প্রোটোটাইপ, তারপরে আমাদের কাজটি না করে আমাদের জন্য এটি ফিরিয়ে দিন।
প্রথম জিনিসগুলি প্রথমে আমাদের 'ব্যক্তিগত' এবং সহায়ক ফাংশন তৈরি করা যাক। এটি আমাদের পরিচিত কারখানার সাথে ঠিক একই জিনিসটি করার কারণে এটি খুব পরিচিত হওয়া উচিত। আমি এখানে প্রতিটি লাইন কী করে তা ব্যাখ্যা করব না কারণ আমি কারখানার উদাহরণে এটি করেছি, আপনি যদি বিভ্রান্ত হন তবে কারখানার উদাহরণটি পুনরায় পড়ুন।
app.service('myService', function($http, $q){
var baseUrl = 'https://itunes.apple.com/search?term=';
var _artist = '';
var _finalUrl = '';
var makeUrl = function(){
_artist = _artist.split(' ').join('+');
_finalUrl = baseUrl + _artist + '&callback=JSON_CALLBACK'
return _finalUrl;
}
});
এখন, আমরা আমাদের সমস্ত পদ্ধতি যুক্ত করব যা আমাদের নিয়ামকটিতে 'এটি'র জন্য উপলব্ধ available
app.service('myService', function($http, $q){
var baseUrl = 'https://itunes.apple.com/search?term=';
var _artist = '';
var _finalUrl = '';
var makeUrl = function(){
_artist = _artist.split(' ').join('+');
_finalUrl = baseUrl + _artist + '&callback=JSON_CALLBACK'
return _finalUrl;
}
this.setArtist = function(artist){
_artist = artist;
}
this.getArtist = function(){
return _artist;
}
this.callItunes = function(){
makeUrl();
var deferred = $q.defer();
$http({
method: 'JSONP',
url: _finalUrl
}).success(function(data){
deferred.resolve(data);
}).error(function(){
deferred.reject('There was an error')
})
return deferred.promise;
}
});
এখন ঠিক আমাদের কারখানার মতোই, সেটআর্টলিস্ট, গেটআরটিস্ট, এবং কলআইটিউনস যে কোনও কন্ট্রোলারে আমরা মাই সার্ভিসটিতে যাব তা উপলব্ধ থাকবে। এখানে মাই সার্ভিস নিয়ন্ত্রক (যা আমাদের ফ্যাক্টরি নিয়ামকের মতো প্রায় একই)
app.controller('myServiceCtrl', function($scope, myService){
$scope.data = {};
$scope.updateArtist = function(){
myService.setArtist($scope.data.artist);
};
$scope.submitArtist = function(){
myService.callItunes()
.then(function(data){
$scope.data.artistData = data;
}, function(data){
alert(data);
})
}
});
আমি আগে যেমন উল্লেখ করেছি, একবার আপনি সত্যিই 'নতুন' কী করে তা বুঝতে পারার পরে, পরিষেবাগুলি অ্যাঙ্গুলারজেএস-এর কারখানার প্রায় একইরকম।
3) সরবরাহকারী
সরবরাহকারীদের সম্পর্কে মনে রাখা সবচেয়ে বড় বিষয়টি হ'ল তারা হ'ল একমাত্র পরিষেবা যা আপনি আপনার অ্যাপ্লিকেশনটির অ্যাপ্লিকেশন কনফিগ অংশে যেতে পারেন। আপনার অ্যাপ্লিকেশনের অন্য কোথাও উপলভ্য হওয়ার আগে আপনার যদি আপনার পরিষেবা অবজেক্টের কিছু অংশ পরিবর্তন করার প্রয়োজন হয় তবে এটি অত্যন্ত গুরুত্বপূর্ণ। যদিও পরিষেবাদি / কারখানার সাথে খুব মিল, তবে কয়েকটি পার্থক্য রয়েছে যা আমরা আলোচনা করব।
প্রথমে আমরা আমাদের সরবরাহকারীটিকে আমাদের পরিষেবা এবং কারখানার সাথে একইভাবে সেট আপ করেছি। নীচে ভেরিয়েবলগুলি আমাদের 'ব্যক্তিগত' এবং সহায়তা ফাংশন।
app.provider('myProvider', function(){
var baseUrl = 'https://itunes.apple.com/search?term=';
var _artist = '';
var _finalUrl = '';
//Going to set this property on the config function below.
this.thingFromConfig = ‘’;
var makeUrl = function(){
_artist = _artist.split(' ').join('+');
_finalUrl = baseUrl + _artist + '&callback=JSON_CALLBACK'
return _finalUrl;
}
}
* আবার যদি উপরের কোডের কোনও অংশ বিভ্রান্তিকর হয় তবে ফ্যাক্টরি বিভাগটি পরীক্ষা করে দেখুন যেখানে আমি ব্যাখ্যা করি যে এটি সমস্ত কি এটি আরও বেশি বিশদ করে।
আপনি সরবরাহকারীদের তিনটি বিভাগ বলে মনে করতে পারেন। প্রথম বিভাগটি হ'ল 'ব্যক্তিগত' ভেরিয়েবল / ফাংশন যা পরে পরিবর্তিত / সেট করা হবে (উপরে দেখানো হয়েছে)। দ্বিতীয় বিভাগটি হল এমন ভেরিয়েবল / ফাংশন যা আপনার অ্যাপ.config ফাংশনে উপলভ্য হবে এবং অন্য কোথাও উপলভ্য হওয়ার আগে এটি পরিবর্তন করার জন্য উপলব্ধ (উপরেও দেখানো হয়েছে)। এই ভেরিয়েবলগুলি 'এই' কীওয়ার্ডের সাথে সংযুক্ত করা দরকার তা লক্ষ করা গুরুত্বপূর্ণ। আমাদের উদাহরণস্বরূপ, অ্যাপ্লিকেশন-কনফিগটিতে পরিবর্তনের জন্য কেবলমাত্র 'জিনিস ফ্রমকনফিগ' উপলব্ধ থাকবে। তৃতীয় বিভাগ (নীচে দেখানো হয়েছে) এমন সমস্ত পরিবর্তনশীল / ফাংশন যা আপনার নিয়ামকটিতে যখন আপনি 'মাইপ্রোভাইডার' পরিষেবাটি নির্দিষ্ট কন্ট্রোলারে প্রবেশ করবেন তখন তা উপলব্ধ থাকবে।
সরবরাহকারীর সাথে পরিষেবা তৈরি করার সময়, আপনার নিয়ামকটিতে কেবলমাত্র বৈশিষ্ট্য / পদ্ধতিগুলি পাওয়া যাবে সেগুলি হ'ল properties get () ফাংশন থেকে ফিরে আসা বৈশিষ্ট্য / পদ্ধতিগুলি। নীচের কোডগুলি "এই" পেতে (যা আমরা জানি যে শেষ পর্যন্ত সেই ফাংশন থেকে ফিরে আসবে) রাখে। এখন, function ফাংশনটি আমাদের নিয়ামকটিতে যে সমস্ত পদ্ধতি / বৈশিষ্ট্যগুলি উপলভ্য হতে চায় তা প্রদান করে। এখানে একটি কোড উদাহরণ।
this.$get = function($http, $q){
return {
callItunes: function(){
makeUrl();
var deferred = $q.defer();
$http({
method: 'JSONP',
url: _finalUrl
}).success(function(data){
deferred.resolve(data);
}).error(function(){
deferred.reject('There was an error')
})
return deferred.promise;
},
setArtist: function(artist){
_artist = artist;
},
getArtist: function(){
return _artist;
},
thingOnConfig: this.thingFromConfig
}
}
এখন পুরো সরবরাহকারীর কোডটি এর মতো দেখাচ্ছে
app.provider('myProvider', function(){
var baseUrl = 'https://itunes.apple.com/search?term=';
var _artist = '';
var _finalUrl = '';
//Going to set this property on the config function below
this.thingFromConfig = '';
var makeUrl = function(){
_artist = _artist.split(' ').join('+');
_finalUrl = baseUrl + _artist + '&callback=JSON_CALLBACK'
return _finalUrl;
}
this.$get = function($http, $q){
return {
callItunes: function(){
makeUrl();
var deferred = $q.defer();
$http({
method: 'JSONP',
url: _finalUrl
}).success(function(data){
deferred.resolve(data);
}).error(function(){
deferred.reject('There was an error')
})
return deferred.promise;
},
setArtist: function(artist){
_artist = artist;
},
getArtist: function(){
return _artist;
},
thingOnConfig: this.thingFromConfig
}
}
});
এখন ঠিক যেমন আমাদের কারখানা ও পরিষেবাতে সেটআর্টিস্ট, গেটআরটিস্ট, এবং কলআইটিউনস আমরা মাইপ্রোভাইডারকে যে কোনও কন্ট্রোলারে যাব তা উপলব্ধ থাকবে। এখানে মাইপ্রোভাইডার নিয়ামক (যা আমাদের ফ্যাক্টরি / পরিষেবা নিয়ামকের মতো প্রায় একই)
app.controller('myProviderCtrl', function($scope, myProvider){
$scope.data = {};
$scope.updateArtist = function(){
myProvider.setArtist($scope.data.artist);
};
$scope.submitArtist = function(){
myProvider.callItunes()
.then(function(data){
$scope.data.artistData = data;
}, function(data){
alert(data);
})
}
$scope.data.thingFromConfig = myProvider.thingOnConfig;
});
পূর্বে উল্লিখিত হিসাবে, সরবরাহকারীর সাথে একটি পরিষেবা তৈরির পুরো পয়েন্টটি চূড়ান্ত অবজেক্টটি অ্যাপ্লিকেশনটির বাকি অংশে যাওয়ার আগে অ্যাপ.config ফাংশনের মাধ্যমে কিছু ভেরিয়েবল পরিবর্তন করতে সক্ষম হবে। এর একটি উদাহরণ দেখা যাক।
app.config(function(myProviderProvider){
//Providers are the only service you can pass into app.config
myProviderProvider.thingFromConfig = 'This sentence was set in app.config. Providers are the only service that can be passed into config. Check out the code to see how it works';
});
এখন আপনি দেখতে পাবেন যে কীভাবে 'প্রযোজ্য ফর্মকনফিগ' আমাদের সরবরাহকারীর মতো খালি স্ট্রিং, কিন্তু যখন এটি ডম-এ প্রদর্শিত হবে, তখন এটি হবে 'এই বাক্যটি সেট করা হয়েছিল ...'।
