为什么我无法在 Angular JS Service.js 执行函数后更改数据？

Question

我已经为我的 2 个控制器使用了这项服务（每个控制器都在不同的 html 页面中）。当我单击该函数时，它无法更改我之前设置的默认变量

服务

angular.module('starter.services', [])
    .service('ContentSize', function() {
        var triggers = [{
            count: 1
        }];
        var counters = [{
            index: 0
        }, {
            index: 1
        }, {
            index: 2
        }];
        return {
            getCounters: function() {
                return counters;
            },
            getCounter: function() {
                for (var i = 0; i < counters.length; i++) {
                    if (counters[i].index = triggers[0].count) {
                        return [counters[i].index];
                        break;
                    }
                }
            },
            setIndex: function(counter) {
                triggers[0].count = counter;
                console.log(triggers[0].count);
            },
            getIndex: function() {
                return triggers[0].count;
            }
        };
    });

我放在函数内部的 console.log 运行良好，但是当我把它放在 return 部分之外时，它甚至不显示默认触发器 [0].count。谁能帮我理解这个问题？

//This is the 1st controller :
.controller('cat1Controller' , function($scope, ContentSize) {

    //Text Size Declaration for text in page
    $scope.textTriggers = [{count: 0, size:2}];

    $scope.Index = ContentSize.getIndex();
    if ($scope.Index == 0) {
        $scope.textTriggers = [{count: 0, size:2}];
        console.log('Default');
    } 
    else if ($scope.Index == 1) {
        $scope.textTriggers = [{count: 1, size:3}];
        console.log('Medium');
    }
    else {
        $scope.textTriggers = [{count: 2, size:4}];
        console.log('Large');
    }
})

//The2nd Contorller
.controller('ModalController', function($scope, $ionicModal, ContentSize) {
  $ionicModal.fromTemplateUrl('templates/settingmodal.html', {
    scope: $scope,
    animation: 'slide-in-up'
  }).then(function(modal) {
    $scope.modal = modal;
  });
  $scope.openModal = function() {
    $scope.modal.show();
  };
  $scope.closeModal = function() {
    $scope.modal.hide();
  };
  $scope.small = function (x) {
    ContentSize.setIndex(x);
  };
  $scope.medium = function (x) {
      ContentSize.setIndex(x);
  };
  $scope.large = function (x) {
    ContentSize.setIndex(x);
  };
});

Answer 1

如果您将 console.log() 'outside' 放在服务的 return 部分，那么它将始终仅被调用一次：服务首次初始化时。那是因为您放在 return 之外的代码仅在服务实例化时执行，这只会发生一次（Angular 服务是单例）。

您 return 从服务中获取的函数（即 getCounters()、getCounter()、setIndex() 和 getIndex()）是您正在 return 的服务对象的属性.这些有效地充当您的服务的 API，并且是您的控制器可以自由调用的 'public' 函数。

因此，每当控制器调用其中一个函数时，就会调用这些函数中的任何一个的代码，因此每次函数时都会执行其中一个函数中的 console.log()被调用。

但是这个 returned 服务对象的代码 outside 只被调用一次，这就是为什么 console.log() 在 return call 也只调用一次。

为什么我无法在 Angular JS Service.js 执行函数后更改数据？

Why I Cannot Change Data In Angular JS Service.js After executing function?

javascript

service

angularjs