Seperti yang saya pahami, ketika di dalam pabrik saya mengembalikan objek yang akan disuntikkan ke controller. Ketika di dalam layanan saya berurusan dengan objek menggunakan thisdan tidak mengembalikan apa pun.

Saya berada di bawah asumsi bahwa layanan selalu singleton , dan bahwa objek pabrik baru akan disuntikkan di setiap pengontrol. Namun, ternyata, objek pabrik juga singleton?

Contoh kode untuk diperagakan:

var factories = angular.module('app.factories', []);
var app = angular.module('app',  ['ngResource', 'app.factories']);

factories.factory('User', function () {
  return {
    first: 'John',
    last: 'Doe'
  };
});

app.controller('ACtrl', function($scope, User) {
  $scope.user = User;
});

app.controller('BCtrl', function($scope, User) {
  $scope.user = User;
});

Ketika mengubah user.firstdalam ACtrlternyata user.firstdi BCtrljuga berubah, misalnya Useradalah tunggal?

Asumsi saya adalah bahwa instance baru disuntikkan ke controller dengan pabrik?

Semua layanan sudut adalah lajang :

Documents (lihat Layanan sebagai lajang ): https://docs.angularjs.org/guide/services

Terakhir, penting untuk menyadari bahwa semua layanan Angular adalah lajang aplikasi. Ini berarti bahwa hanya ada satu contoh layanan yang diberikan per injector.

Pada dasarnya perbedaan antara layanan dan pabrik adalah sebagai berikut:

app.service('myService', function() {

  // service is just a constructor function
  // that will be called with 'new'

  this.sayHello = function(name) {
     return "Hi " + name + "!";
  };
});

app.factory('myFactory', function() {

  // factory returns an object
  // you can run some code before

  return {
    sayHello : function(name) {
      return "Hi " + name + "!";
    }
  }
});

Lihat presentasi ini tentang $ berikan: http://slides.wesalvaro.com/20121113/#/

Slide tersebut digunakan di salah satu pertemuan AngularJs: http://blog.angularjs.org/2012/11/more-angularjs-meetup-videos.html

Bagi saya wahyu datang ketika saya menyadari bahwa mereka semua bekerja dengan cara yang sama: dengan menjalankan sesuatu sekali , menyimpan nilai yang mereka dapatkan, dan kemudian batuk nilai tersimpan yang sama ketika dirujuk melalui Dependency Injection.

Katakanlah kita memiliki:

app.factory('a', fn);
app.service('b', fn);
app.provider('c', fn);

Perbedaan antara ketiganya adalah:

1. aNilai yang disimpan berasal dari menjalankan fn, dengan kata lain:fn()
2. bNilai yang disimpan berasal dari newing fn, dengan kata lain:new fn()
3. cNilai yang disimpan berasal dari pertama mendapatkan instance dengan newing fn, dan kemudian menjalankan $getmetode instance

yang berarti, ada sesuatu seperti objek cache di dalam angular, yang nilainya setiap injeksi hanya diberikan satu kali, ketika mereka telah disuntikkan pertama kali, dan di mana:

cache.a = fn()
cache.b = new fn()
cache.c = (new fn()).$get()

Inilah sebabnya kami menggunakan thisdalam layanan, dan mendefinisikan this.$getpenyedia dalam.

Semoga ini membantu.

contoh hidup

Contoh "halo dunia"

dengan factory/ service/ provider:

var myApp = angular.module('myApp', []);

//service style, probably the simplest one
myApp.service('helloWorldFromService', function() {
    this.sayHello = function() {
        return "Hello, World!"
    };
});

//factory style, more involved but more sophisticated
myApp.factory('helloWorldFromFactory', function() {
    return {
        sayHello: function() {
            return "Hello, World!"
        }
    };
});

//provider style, full blown, configurable version     
myApp.provider('helloWorld', function() {
    // In the provider function, you cannot inject any
    // service or factory. This can only be done at the
    // "$get" method.

    this.name = 'Default';

    this.$get = function() {
        var name = this.name;
        return {
            sayHello: function() {
                return "Hello, " + name + "!"
            }
        }
    };

    this.setName = function(name) {
        this.name = name;
    };
});

//hey, we can configure a provider!            
myApp.config(function(helloWorldProvider){
    helloWorldProvider.setName('World');
});


function MyCtrl($scope, helloWorld, helloWorldFromFactory, helloWorldFromService) {

    $scope.hellos = [
        helloWorld.sayHello(),
        helloWorldFromFactory.sayHello(),
        helloWorldFromService.sayHello()];
}​

Ada juga cara untuk mengembalikan fungsi konstruktor sehingga Anda dapat kembali newable kelas di pabrik-pabrik, seperti ini:

function MyObjectWithParam($rootScope, name) {
  this.$rootScope = $rootScope;
  this.name = name;
}
MyObjectWithParam.prototype.getText = function () {
  return this.name;
};

App.factory('MyObjectWithParam', function ($injector) {
  return function(name) { 
    return $injector.instantiate(MyObjectWithParam,{ name: name });
  };
}); 

Jadi Anda bisa melakukan ini di controller, yang menggunakan MyObjectWithParam:

var obj = new MyObjectWithParam("hello"),

Lihat di sini contoh lengkapnya:
http://plnkr.co/edit/GKnhIN?p=preview

Dan di sini halaman grup Google, di mana dibahas:
https://groups.google.com/forum/#!msg/angular/56sdORWEoqg/b8hdPskxZXsJ

Inilah perbedaan utamanya:

Jasa

Sintaksis: module.service( 'serviceName', function );

Hasil: Saat mendeklarasikan serviceName sebagai argumen yang dapat disuntikkan, Anda akan diberikan instance fungsi yang diteruskan ke module.service.

Penggunaan: Dapat bermanfaat untuk berbagi fungsi utilitas yang berguna untuk dipanggil hanya dengan menambahkan () ke referensi fungsi yang disuntikkan. Bisa juga dijalankan dengan injectedArg.call( this )atau serupa.

Pabrik

Sintaksis: module.factory( 'factoryName', function );

Hasil: Saat mendeklarasikan factoryName sebagai argumen injeksi, Anda akan diberikan nilai yang dikembalikan dengan memohon referensi fungsi yang diteruskan ke module.factory.

Penggunaan: Dapat berguna untuk mengembalikan fungsi 'kelas' yang kemudian dapat digunakan untuk membuat instance.

Juga periksa dokumentasi AngularJS dan pertanyaan serupa tentang stackoverflow bingung tentang layanan vs pabrik .

Berikut ini adalah contoh menggunakan layanan dan pabrik . Baca lebih lanjut tentang layanan AngularJS vs pabrik .

Menambah jawaban pertama, saya pikir .service () adalah untuk orang-orang yang telah menulis kode mereka dalam gaya yang lebih berorientasi objek (C # / Java) (menggunakan kata kunci ini dan objek instantiating melalui fungsi prototipe / Konstruktor).

Factory adalah untuk pengembang yang menulis kode yang lebih alami untuk javascript / gaya fungsional pengkodean.

Lihatlah kode sumber metode .service dan .factory di dalam angular.js - secara internal mereka semua memanggil metode penyedia:

  function provider(name, provider_) {
    if (isFunction(provider_)) {
      provider_ = providerInjector.instantiate(provider_);
    }
    if (!provider_.$get) {
      throw Error('Provider ' + name + ' must define $get factory method.');
    }
    return providerCache[name + providerSuffix] = provider_;
  }

  function factory(name, factoryFn) { \
    return provider(name, { $get: factoryFn }); 
  }

  function service(name, constructor) {
    return factory(name, ['$injector', function($injector) {
      return $injector.instantiate(constructor);
    }]);
  }

Sangat sederhana:

.service - fungsi terdaftar akan dipanggil sebagai konstruktor (alias 'baru')

.factory - fungsi terdaftar akan dipanggil sebagai fungsi sederhana

Keduanya dipanggil sekali sehingga menghasilkan objek tunggal yang akan disuntikkan ke komponen lain dari aplikasi Anda.

Semua penyedia bekerja dengan cara yang sama. Metode yang berbeda service, factory, providerhanya membiarkan Anda mencapai hal yang sama dalam kode kurang.

PS Ada juga valuedan constant.

Setiap kasus khusus di rantai mulai dengan providerdan berakhir dengan valuememiliki batasan tambahan. Jadi untuk memutuskan di antara mereka, Anda harus bertanya pada diri sendiri yang mana Anda dapat mencapai apa yang Anda inginkan dengan kode lebih sedikit.

Ini adalah gambar yang menunjukkan apa yang saya maksud:

Anda dapat rincian dan referensi panduan di posting blog saya mendapatkan gambar ini dari:

http://www.simplygoodcode.com/2015/11/the-difference-between-service-provider-and-factory-in-angularjs/

Berikut adalah beberapa contoh layanan vs pabrik yang mungkin berguna dalam melihat perbedaan di antara mereka. Pada dasarnya, sebuah layanan memiliki "baru ..." yang dipanggil, itu sudah dipakai. Sebuah pabrik tidak secara instantiated secara otomatis.

Contoh dasar

Mengembalikan objek kelas yang memiliki metode tunggal

Berikut adalah layanan yang memiliki satu metode:

angular.service('Hello', function () {
  this.sayHello = function () { /* ... */ };
});

Berikut adalah pabrik yang mengembalikan objek dengan metode:

angular.factory('ClassFactory', function () {
  return {
    sayHello: function () { /* ... */ }
  };
});

Kembalikan nilai

Pabrik yang mengembalikan daftar angka:

angular.factory('NumberListFactory', function () {
  return [1, 2, 3, 4, 5];
});

console.log(NumberListFactory);

Layanan yang mengembalikan daftar angka:

angular.service('NumberLister', function () {
  this.numbers = [1, 2, 3, 4, 5];
});

console.log(NumberLister.numbers);

Output dalam kedua kasus adalah sama, daftar angka.

Contoh lanjutan

Variabel "Kelas" menggunakan pabrik

Dalam contoh ini kita mendefinisikan CounterFactory, itu menambah atau mengurangi counter dan Anda bisa mendapatkan jumlah saat ini atau mendapatkan berapa banyak objek CounterFactory telah dibuat:

angular.factory('CounterFactory', function () {
  var number_of_counter_factories = 0; // class variable

  return function () {
    var count = 0; // instance variable
    number_of_counter_factories += 1; // increment the class variable

    // this method accesses the class variable
    this.getNumberOfCounterFactories = function () {
      return number_of_counter_factories;
    };

    this.inc = function () {
      count += 1;
    };
    this.dec = function () {
      count -= 1;
    };
    this.getCount = function () {
      return count;
    };
  }

})

Kami menggunakan CounterFactoryuntuk membuat banyak penghitung. Kita dapat mengakses variabel kelas untuk melihat berapa banyak penghitung yang dibuat:

var people_counter;
var places_counter;

people_counter = new CounterFactory();
console.log('people', people_counter.getCount());
people_counter.inc();
console.log('people', people_counter.getCount());

console.log('counters', people_counter.getNumberOfCounterFactories());

places_counter = new CounterFactory();
console.log('places', places_counter.getCount());

console.log('counters', people_counter.getNumberOfCounterFactories());
console.log('counters', places_counter.getNumberOfCounterFactories());

Output dari kode ini adalah:

people 0
people 1
counters 1
places 0
counters 2
counters 2

"Pabrik" dan "Layanan" adalah berbagai cara melakukan DI (Dependency injection) dalam sudut.

Jadi ketika kita mendefinisikan DI menggunakan "layanan" seperti yang ditunjukkan pada kode di bawah ini. Ini menciptakan instance GLOBAL baru dari objek "Logger" dan menyuntikkannya ke fungsi.

app.service("Logger", Logger); // Injects a global object

Ketika Anda mendefinisikan DI menggunakan "pabrik" itu tidak membuat instance. Itu hanya melewati metode dan kemudian konsumen secara internal harus membuat panggilan ke pabrik untuk contoh objek.

app.factory("Customerfactory", CreateCustomer);

Di bawah ini adalah gambar sederhana yang menunjukkan secara visual bagaimana proses DI untuk "Layanan" berbeda dari "Pabrik".

Pabrik harus digunakan Ketika kita ingin membuat berbagai jenis objek tergantung pada skenario. Misalnya tergantung pada skenario kami ingin membuat objek "Pelanggan" sederhana, atau "Pelanggan" dengan objek "Alamat" atau "Pelanggan" dengan objek "Telepon". Berikut ini penjelasan terperinci dari paragraf ini

Layanan harus digunakan Ketika kita memiliki utilitas atau fungsi bersama yang akan disuntikkan seperti Utilitas, Logger, Penangan kesalahan dll.

Gaya layanan : ( mungkin yang paling sederhana ) mengembalikan fungsi sebenarnya: Berguna untuk berbagi fungsi utilitas yang berguna untuk dipanggil hanya dengan menambahkan () ke referensi fungsi yang disuntikkan.

Layanan di AngularJS adalah objek JavaScript tunggal yang berisi serangkaian fungsi

var myModule = angular.module("myModule", []);

myModule.value  ("myValue"  , "12345");

function MyService(myValue) {
    this.doIt = function() {
        console.log("done: " + myValue;
    }
}

myModule.service("myService", MyService);
myModule.controller("MyController", function($scope, myService) {

    myService.doIt();

});

Gaya pabrik : ( lebih terlibat tetapi lebih canggih ) mengembalikan nilai pengembalian fungsi: instantiate objek seperti Object baru () di java.

Pabrik adalah fungsi yang menciptakan nilai. Ketika suatu layanan, pengontrol, dll. Membutuhkan suatu nilai yang disuntikkan dari suatu pabrik, pabrik tersebut menciptakan nilai berdasarkan permintaan. Setelah dibuat, nilai tersebut digunakan kembali untuk semua layanan, pengontrol, dll. Yang perlu disuntikkan.

var myModule = angular.module("myModule", []);

myModule.value("numberValue", 999);

myModule.factory("myFactory", function(numberValue) {
    return "a value: " + numberValue;
})  
myModule.controller("MyController", function($scope, myFactory) {

    console.log(myFactory);

});

Gaya penyedia : ( versi penuh, dapat dikonfigurasi ) mengembalikan output dari fungsi $ get fungsi: Dapat dikonfigurasi.

Penyedia di AngularJS adalah bentuk pabrik paling fleksibel yang dapat Anda buat. Anda mendaftarkan penyedia dengan modul seperti yang Anda lakukan dengan layanan atau pabrik, kecuali Anda menggunakan fungsi provider ().

var myModule = angular.module("myModule", []);

myModule.provider("mySecondService", function() {
    var provider = {};
    var config   = { configParam : "default" };

    provider.doConfig = function(configParam) {
        config.configParam = configParam;
    }

    provider.$get = function() {
        var service = {};

        service.doService = function() {
            console.log("mySecondService: " + config.configParam);
        }

        return service;
    }

    return provider;
});

myModule.config( function( mySecondServiceProvider ) {
    mySecondServiceProvider.doConfig("new config param");
});

myModule.controller("MyController", function($scope, mySecondService) {

    $scope.whenButtonClicked = function() {
        mySecondService.doIt();
    }

});

src jenkov

<!DOCTYPE html>
    <html ng-app="app">
    <head>
    	<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.0.1/angular.min.js"></script>
    	<meta charset=utf-8 />
    	<title>JS Bin</title>
    </head>
    <body ng-controller="MyCtrl">
    	{{serviceOutput}}
    	<br/><br/>
    	{{factoryOutput}}
    	<br/><br/>
    	{{providerOutput}}
    
    	<script>
    
    		var app = angular.module( 'app', [] );
    
    		var MyFunc = function() {
    
    			this.name = "default name";
    
    			this.$get = function() {
    				this.name = "new name"
    				return "Hello from MyFunc.$get(). this.name = " + this.name;
    			};
    
    			return "Hello from MyFunc(). this.name = " + this.name;
    		};
    
    		// returns the actual function
    		app.service( 'myService', MyFunc );
    
    		// returns the function's return value
    		app.factory( 'myFactory', MyFunc );
    
    		// returns the output of the function's $get function
    		app.provider( 'myProv', MyFunc );
    
    		function MyCtrl( $scope, myService, myFactory, myProv ) {
    
    			$scope.serviceOutput = "myService = " + myService;
    			$scope.factoryOutput = "myFactory = " + myFactory;
    			$scope.providerOutput = "myProvider = " + myProv;
    
    		}
    
    	</script>
    
    </body>
    </html>

jsbin

<!DOCTYPE html>
<html ng-app="myApp">
<head>
	<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.0.1/angular.min.js"></script>
	<meta charset=utf-8 />
	<title>JS Bin</title>
</head>
<body>
<div ng-controller="MyCtrl">
    {{hellos}}
</div>
	<script>

	var myApp = angular.module('myApp', []);

//service style, probably the simplest one
myApp.service('helloWorldFromService', function() {
    this.sayHello = function() {
        return "Hello, World!"
    };
});

//factory style, more involved but more sophisticated
myApp.factory('helloWorldFromFactory', function() {
    return {
        sayHello: function() {
            return "Hello, World!"
        }
    };
});
    
//provider style, full blown, configurable version     
myApp.provider('helloWorld', function() {

    this.name = 'Default';

    this.$get = function() {
        var name = this.name;
        return {
            sayHello: function() {
                return "Hello, " + name + "!"
            }
        }
    };

    this.setName = function(name) {
        this.name = name;
    };
});

//hey, we can configure a provider!            
myApp.config(function(helloWorldProvider){
    helloWorldProvider.setName('World');
});
        

function MyCtrl($scope, helloWorld, helloWorldFromFactory, helloWorldFromService) {
    
    $scope.hellos = [
        helloWorld.sayHello(),
        helloWorldFromFactory.sayHello(),
        helloWorldFromService.sayHello()];
}
	</script>

</body>
</html>

jsfiddle

Perbedaan mendasar, adalah bahwa penyedia memungkinkan untuk menetapkan nilai-nilai fungsi primitif (non-objek), array, atau panggilan balik ke dalam variabel yang dinyatakan pabrik, dan dengan demikian jika mengembalikan objek itu harus dinyatakan dan dikembalikan secara eksplisit.

Di sisi lain, layanan hanya dapat digunakan untuk mengatur variabel yang dinyatakan layanan ke objek, sehingga kami dapat menghindari pembuatan eksplisit dan pengembalian objek, sementara di sisi lain ia memungkinkan penggunaan kata kunci ini .

Atau dengan kata singkat " penyedia adalah bentuk yang lebih umum sementara layanan terbatas pada objek saja".

Inilah bagaimana saya memahami perbedaan di antara mereka dalam hal pola desain:

Layanan : Mengembalikan suatu jenis, yang akan diberitakan baru untuk membuat objek jenis itu. Jika analogi Java digunakan, Layanan mengembalikan definisi Kelas Java .

Pabrik : Mengembalikan benda konkret yang dapat segera digunakan. Dalam Java Analogy, Factory mengembalikan Object Java .

Bagian yang sering membingungkan orang (termasuk saya) adalah bahwa ketika Anda menyuntikkan Layanan atau Pabrik dalam kode Anda, mereka dapat digunakan dengan cara yang sama, apa yang Anda dapatkan dalam kode Anda dalam kedua kasus adalah objek konkret yang dapat segera Anda panggil. Yang berarti dalam hal Layanan, panggilan sudut "baru" pada deklarasi layanan atas nama Anda. Saya pikir ini adalah konsep yang berbelit-belit.

Ini akan menjadi jawaban terbaik dan singkat untuk memahami Service Vs Factory Vs Provider

Sumber : https://groups.google.com/forum/#!msg/angular/56sdORWEoqg/HuZsOsMvKv4J

Inilah yang dikatakan ben dengan demo http://jsbin.com/ohamub/1/edit?html,output

"Ada komentar dalam kode yang mengilustrasikan perbedaan utama tetapi saya akan sedikit memperluasnya di sini. Sebagai catatan, saya hanya memikirkan hal ini jadi jika saya mengatakan sesuatu yang salah, tolong beri tahu saya.

Jasa

Sintaks : module.service ('serviceName', function);

Hasil : Saat mendeklarasikan serviceName sebagai argumen injeksi, Anda akan diberikan referensi fungsi aktual yang diteruskan ke module.service.

Penggunaan : Dapat bermanfaat untuk berbagi fungsi utilitas yang berguna untuk dipanggil hanya dengan menambahkan () ke referensi fungsi yang disuntikkan. Bisa juga dijalankan dengan injectedArg.call (ini) atau yang serupa.

Pabrik

Sintaks : module.factory ('factoryName', fungsi);

Hasil : Saat mendeklarasikan factoryName sebagai argumen injeksi, Anda akan diberikan nilai yang dikembalikan dengan memohon referensi fungsi yang diteruskan ke module.factory.

Penggunaan : Dapat berguna untuk mengembalikan fungsi 'kelas' yang kemudian dapat digunakan untuk membuat instance.

Penyedia

Sintaks : module.provider ('providerName', function);

Hasil : Ketika mendeklarasikan providerName sebagai argumen injeksi, Anda akan diberikan nilai yang dikembalikan dengan memanggil metode $ get dari referensi fungsi yang diteruskan ke module.provider.

Penggunaan : Dapat berguna untuk mengembalikan fungsi 'kelas' yang kemudian dapat baru untuk membuat instance tetapi yang membutuhkan semacam konfigurasi sebelum disuntikkan. Mungkin berguna untuk kelas yang dapat digunakan kembali di seluruh proyek? Masih agak kabur untuk yang satu ini. "Ben

Saya memiliki kebingungan ini untuk sementara waktu dan saya mencoba yang terbaik untuk memberikan penjelasan sederhana di sini. Semoga ini bisa membantu!

angular .factorydan angular .servicekeduanya digunakan untuk menginisialisasi layanan dan bekerja dengan cara yang sama.

Satu-satunya perbedaan adalah, bagaimana Anda ingin menginisialisasi layanan Anda.

Keduanya lajang

var app = angular.module('app', []);

Pabrik

app.factory ( <service name>, <function with a return value>)

Jika Anda ingin menginisialisasi layanan Anda dari fungsi yang Anda miliki dengan nilai kembali , Anda harus menggunakan factorymetode ini .

misalnya

function myService() {
  //return what you want
  var service = {
    myfunc: function (param) { /* do stuff */ }
  }
  return service;
}

app.factory('myService', myService);

Saat menyuntikkan layanan ini (misalnya ke controller Anda):

• Angular akan memanggil fungsi yang Anda berikan (sebagai myService()) untuk mengembalikan objek
• Singleton - dipanggil hanya sekali, disimpan, dan lulus objek yang sama.

Layanan

app.service ( <service name>, <constructor function>)

Jika Anda ingin menginisialisasi layanan Anda dari fungsi konstruktor (menggunakan thiskata kunci), Anda harus menggunakan servicemetode ini .

misalnya

function myService() {
  this.myfunc: function (param) { /* do stuff */ }
}

app.service('myService', myService);

Saat menyuntikkan layanan ini (misalnya ke controller Anda):

• Angular akan memasukkan newfungsi yang Anda berikan (as new myService()) untuk mengembalikan objek
• Singleton - dipanggil hanya sekali, disimpan, dan lulus objek yang sama.

Contoh - DEMO

• Layanan Sudut vs Pabrik
• Layanan Sudut vs Pabrik (dengan rute)

Inilah yang membantu saya memahami perbedaannya, berkat posting blog oleh Pascal Precht.

Layanan adalah metode pada modul yang mengambil nama dan fungsi yang mendefinisikan layanan. Anda dapat menyuntikkan dan menggunakan layanan khusus itu di komponen lain, seperti pengontrol, arahan dan filter. Pabrik adalah metode pada modul dan juga membutuhkan nama dan fungsi, yang mendefinisikan pabrik. Kami juga dapat menyuntikkan dan menggunakannya dengan cara yang sama kami lakukan dengan layanan.

Objek yang dibuat dengan menggunakan nilai properti prototipe dari fungsi konstruktor mereka sebagai prototipe mereka, jadi saya menemukan kode Angular yang memanggil Object.create (), yang saya percaya adalah fungsi konstruktor layanan ketika akan dipakai. Namun, fungsi pabrik sebenarnya hanya fungsi yang dipanggil, itulah sebabnya kita harus mengembalikan objek literal untuk pabrik.

Berikut adalah kode sudut 1,5 yang saya temukan untuk pabrik:

var needsRecurse = false;
    var destination = copyType(source);

    if (destination === undefined) {
      destination = isArray(source) ? [] : Object.create(getPrototypeOf(source));
      needsRecurse = true;
    }

Cuplikan kode sumber sudut untuk fungsi factory ():

 function factory(name, factoryFn, enforce) {
    return provider(name, {
      $get: enforce !== false ? enforceReturnValue(name, factoryFn) : factoryFn
    });
  }

Dibutuhkan nama dan fungsi pabrik yang dilewati dan mengembalikan penyedia dengan nama yang sama, yang memiliki metode $ get yang merupakan fungsi pabrik kami. Setiap kali Anda meminta injector untuk ketergantungan tertentu, ia pada dasarnya meminta penyedia terkait untuk sebuah instance dari layanan itu, dengan memanggil metode $ get (). Karena itulah diperlukan $ get () saat membuat penyedia.

Berikut adalah kode 1,5 sudut untuk layanan.

function service(name, constructor) {
    return factory(name, ['$injector', function($injector) {
      return $injector.instantiate(constructor);
    }]);
  }

Ternyata ketika kita memanggil service (), sebenarnya memanggil factory ()! Namun, tidak hanya meneruskan fungsi konstruktor layanan kami ke pabrik apa adanya. Itu juga melewati fungsi yang meminta injektor untuk instantiate objek oleh konstruktor yang diberikan.

Dengan kata lain, jika kita menyuntikkan MyService di suatu tempat, yang terjadi dalam kode adalah:

MyServiceProvider.$get(); // return the instance of the service

Untuk menyatakannya kembali, sebuah layanan memanggil sebuah pabrik, yang merupakan metode $ get () pada penyedia terkait. Selain itu, $ injector.instantiate () adalah metode yang akhirnya memanggil Object.create () dengan fungsi konstruktor. Itu sebabnya kami menggunakan "ini" dalam layanan.

Untuk ES5 tidak masalah yang kami gunakan: service () atau factory (), itu selalu merupakan pabrik yang disebut yang menciptakan penyedia untuk layanan kami.

Anda dapat melakukan hal yang sama persis dengan layanan juga. Layanan adalah fungsi konstruktor, namun, itu tidak mencegah kita mengembalikan objek literal. Jadi kita dapat mengambil kode layanan kami dan menuliskannya dengan cara yang pada dasarnya melakukan hal yang sama persis seperti pabrik kami atau dengan kata lain, Anda dapat menulis layanan sebagai pabrik untuk mengembalikan objek.

Mengapa kebanyakan orang merekomendasikan untuk menggunakan pabrik di atas layanan? Ini adalah jawaban terbaik yang pernah saya lihat yang berasal dari buku Pawel Kozlowski: Menguasai Pengembangan Aplikasi Web dengan AngularJS.

Metode pabrik adalah cara paling umum untuk memasukkan objek ke sistem injeksi ketergantungan AngularJS. Ini sangat fleksibel dan dapat berisi logika kreasi yang canggih. Karena pabrik adalah fungsi reguler, kita juga dapat memanfaatkan ruang lingkup leksikal baru untuk mensimulasikan variabel "pribadi". Ini sangat berguna karena kami dapat menyembunyikan detail implementasi layanan yang diberikan. "

• Dengan pabrik Anda benar-benar membuat objek di dalam pabrik dan mengembalikannya.
• Dengan layanan ini Anda hanya memiliki fungsi standar yang menggunakan thiskata kunci untuk mendefinisikan fungsi.
• Dengan penyedia ada $getAnda mendefinisikan dan dapat digunakan untuk mendapatkan objek yang mengembalikan data.

Ada tiga cara menangani logika bisnis di AngularJS: ( Terinspirasi oleh kursus Coursera AngularJS Yaakov ) yaitu:

1. Layanan
2. Pabrik
3. Pemberi

Di sini kita hanya akan berbicara tentang Service vs Factory

LAYANAN :

Sintaksis:

app.js

 var app = angular.module('ServiceExample',[]);
 var serviceExampleController =
              app.controller('ServiceExampleController', ServiceExampleController);
 var serviceExample = app.service('NameOfTheService', NameOfTheService);

 ServiceExampleController.$inject = ['NameOfTheService'] //very important as this protects from minification of js files

function ServiceExampleController(NameOfTheService){
     serviceExampleController = this;
     serviceExampleController.data = NameOfTheService.getSomeData();
 }

function NameOfTheService(){
     nameOfTheService = this;
     nameOfTheService.data = "Some Data";
     nameOfTheService.getSomeData = function(){
           return nameOfTheService.data;
     }     
}

index.html

<div ng-controller = "ServiceExampleController as serviceExample">
   {{serviceExample.data}}
</div>

Fitur utama Layanan:

1. Lazily Instantiated : Jika layanan ini tidak disuntikkan, itu tidak akan pernah instantiated. Jadi untuk menggunakannya Anda harus menyuntikkannya ke modul.

2. Singleton : Jika disuntikkan ke beberapa modul, semua akan memiliki akses hanya ke satu instance tertentu. Itu sebabnya, sangat nyaman untuk berbagi data di seluruh pengontrol yang berbeda.

PABRIK

Sekarang mari kita bicara tentang Factory in AngularJS

Pertama mari kita lihat sintaks :

app.js :

var app = angular.module('FactoryExample',[]);
var factoryController = app.controller('FactoryController', FactoryController);
var factoryExampleOne = app.factory('NameOfTheFactoryOne', NameOfTheFactoryOne);
var factoryExampleTwo = app.factory('NameOfTheFactoryTwo', NameOfTheFactoryTwo);

//first implementation where it returns a function
function NameOfTheFactoryOne(){
   var factory = function(){
      return new SomeService();
    }
   return factory;
}

//second implementation where an object literal would be returned
function NameOfTheFactoryTwo(){
   var factory = {
      getSomeService : function(){
          return new SomeService();
       }
    };
   return factory;
}

Sekarang menggunakan dua di atas di controller:

 var factoryOne = NameOfTheFactoryOne() //since it returns a function
 factoryOne.someMethod();

 var factoryTwo = NameOfTheFactoryTwo.getSomeService(); //accessing the object
 factoryTwo.someMethod();

Fitur pabrik:

1. Jenis layanan ini mengikuti pola desain pabrik . Pabrik dapat dianggap sebagai tempat sentral yang menciptakan objek atau metode baru.

2. Ini tidak hanya menghasilkan singleton, tetapi juga layanan yang dapat disesuaikan.

3. The .service()Metode adalah pabrik yang selalu menghasilkan jenis yang sama dari layanan, yang merupakan tunggal. Tidak ada cara mudah untuk mengkonfigurasi perilaku itu. Itu .service()metode biasanya digunakan sebagai jalan pintas untuk sesuatu yang tidak memerlukan apapun konfigurasi.

Untuk penjelasan singkat dan sederhana, lihat https://stackoverflow.com/a/26924234/5811973 .

Untuk penjelasan terperinci, lihat https://stackoverflow.com/a/15666049/5811973 .

Juga dari dokumentasi angularJs:

Anda dapat memahami perbedaannya dengan analogi ini - Pertimbangkan perbedaan antara fungsi normal yang akan mengembalikan beberapa nilai dan fungsi konstruktor yang akan dipakai di awal menggunakan kata kunci baru. sebuah objek) sedangkan menciptakan layanan seperti menciptakan fungsi konstruktor (kelas OO) yang kita dapat membuat contoh menggunakan kata kunci baru. Satu-satunya hal yang perlu diperhatikan adalah di sini adalah bahwa ketika kita menggunakan metode Layanan untuk membuat layanan, itu akan secara otomatis membuat contohnya menggunakan mekanisme injeksi ketergantungan yang didukung oleh AngularJS