Являются ли услуги Angularjs singleton?
В ссылке я читал:
Наконец, важно понимать, что все службы Angularприложений. Это означает, что существует только один пример данная услуга на инжектор.
но с этим простым кодом, кажется, не одиночный
'use strict';
angular.module('animal', [])
.factory('Animal',function(){
return function(vocalization){
return {
vocalization:vocalization,
vocalize : function () {
console.log('vocalize: ' + this.vocalization);
}
}
}
});
angular.module('app', ['animal'])
.factory('Dog', function (Animal) {
return Animal('bark bark!');
})
.factory('Cat', function (Animal) {
return Animal('meeeooooow');
})
.controller('MainCtrl',function($scope,Cat,Dog){
$scope.cat = Cat;
$scope.dog = Dog;
console.log($scope.cat);
console.log($scope.dog);
//$scope.cat = Cat;
});
Я немного смущен, не могли бы вы объяснить мне, в чем дело?
ОБНОВЛЕНИЕ 1
Может быть, я не самый острый инструмент в сарае
но дайте @Khanh, чтобы ответить, было бы лучше
объяснение в ссылке не очень понятно.
ОБНОВЛЕНИЕ 2
'use strict';
angular.module('animal', [])
.factory('Animal',function(){
return {
vocalization:'',
vocalize : function () {
console.log('vocalize: ' + this.vocalization);
}
}
});
angular.module('dog', ['animal'])
.factory('Dog', function (Animal) {
Animal.vocalization = 'bark bark!';
Animal.color = 'red';
return Animal;
});
angular.module('cat', ['animal'])
.factory('Cat', function (Animal) {
Animal.vocalization = 'meowwww';
Animal.color = 'white';
return Animal;
});
angular.module('app', ['dog','cat'])
.controller('MainCtrl',function($scope,Cat,Dog){
$scope.cat = Cat;
$scope.dog = Dog;
console.log($scope.cat);
console.log($scope.dog);
//$scope.cat = Cat;
});
ВСПОМОГАТЕЛЬНО!
ОБНОВЛЕНИЕ 3
Но если вам нравится
'use strict';
angular.module('animal', [])
.factory('Animal',function(){
return function(vocalization){
return {
vocalization:vocalization,
vocalize : function () {
console.log('vocalize: ' + this.vocalization);
}
}
}
});
angular.module('app', ['animal'])
.factory('Dog', function (Animal) {
function ngDog(){
this.prop = 'my prop 1';
this.myMethod = function(){
console.log('test 1');
}
}
return angular.extend(Animal('bark bark!'), new ngDog());
})
.factory('Cat', function (Animal) {
function ngCat(){
this.prop = 'my prop 2';
this.myMethod = function(){
console.log('test 2');
}
}
return angular.extend(Animal('meooow'), new ngCat());
})
.controller('MainCtrl',function($scope,Cat,Dog){
$scope.cat = Cat;
$scope.dog = Dog;
console.log($scope.cat);
console.log($scope.dog);
//$scope.cat = Cat;
});
работает
Ответы
Ответ 1
Это singleton, есть только один объект, но он вводится во многие места. (объекты передаются по ссылке на метод)
Все ваши Animal
- указатели объектов, ссылающиеся на тот же объект животного, который является функцией в вашем случае.
Ваши Cat
и Dog
- объекты, созданные этой функцией.
Ответ 2
Да, сервис является одноточечным. Следующий код регистрирует только один "M" для консоли:
function M() { console.log('M'); }
function M1(m) { console.log(1); }
function M2(m) { console.log(2); }
angular.module('app', [])
.service('M', M)
.service('M1', ['M', M1])
.service('M2', ['M', M2])
.controller('MainCtrl',function(M1, M2){});
запустите его в jsbin
Ответ 3
Позвольте мне привести пример о одиночных точках в AngularJS.
Предположим, что у нас есть два контроллера, используемых в разных частях нашего одностраничного приложения:
myApp.controller('mainController', ['$scope', '$log', function($scope, $log) {
$log.main = 'First Var';
$log.log($log);
}]);
Итак, теперь, если мы перейдем на страницу, управляемую с помощью контроллера mainController
, мы увидим это в журнале:
![введите описание изображения здесь]()
Как вы видите, объект журнала теперь содержит мою первую переменную.
Теперь вот мой второй контроллер:
myApp.controller('secondController', ['$scope', '$log', '$routeParams', function($scope, $log, $routeParams) {
$log.secondVar = 'Second Var';
$log.log($log);
}]);
Итак, если вы нажмете на вторую контролируемую страницу, вы увидите следующее:
![введите описание изображения здесь]()
Вернитесь на первую страницу:
![введите описание изображения здесь]()
Что вы делаете с этими тремя шагами?
Их - один $log
объект, введенный в приложение. И как сказал Тони Алиса: "Это большая экономия памяти".
Таким образом, эта служба называется единовременно, и каждый раз мы добавляем новые переменные и параметры к одному и тому же объекту и не добавляем разные объекты для разных параметров.
Ответ 4
В вашем примере используется factory
, а не service
. Обратите внимание, что provider
также является частью игры.
Лучший ресурс обучения:
AngularJS: служба против провайдера vs factory
Существует разъясняющее объяснение Мишко Хевери и практический пример factory
, service
и provider
. Очень рекомендую.