Подтвердить что ты не робот

Являются ли услуги 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;
                });

работает

4b9b3361

Ответ 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. Очень рекомендую.