AngularJS保留局部变量



我有这样的工厂:

TestFactory= function () {
    var objectName=null;
    return {
        SetName:function(name) {
            objectName = name;
        },
        GetName:function() {
            return objectName;
        },
        Init:function() {
            return angular.copy(this);
        }
    }
}

类似的控制器:

TestController = function($scope) {
    $scope.TestClick = function () {
        var tstA = TestFactory.Init();
        var tstB = TestFactory.Init();
        tstA.SetName('test A')
        tstB.SetName('test B')
        console.log('A', tstA.GetName());
        console.log('B', tstB.GetName());
    }   
}

在控制台中我获得了两个对象的Test B

如何制作此对象的适当实例?

我想在工厂的其他功能中使用objectName值。

考虑到在角度,工厂是单例,因此实例总是相同的。

您可以执行以下操作:

TestFactory= function () {
    var objectName={};
    return {
        SetName:function(property,name) {
            objectName[property] = name;
        },
        GetName:function(property) {
            return objectName[property];
        },
        Clear:function(property) {
            delete objectName[property]
        }
    }
}

然后在您的控制器中:

TestController = function($scope, TestFactory) {
    $scope.TestClick = function () {
        TestFactory.SetName('a','test A')
        TestFactory.SetName('b','test B')
        console.log('A', TestFactory.GetName('a')); // test A
        console.log('B', TestFactory.GetName('b')); // test B
    }   
}

几个问题。首先,您返回对象而不是工厂的功能。

app.factory('TestFactory', function() {
  return function() {
    var objectName = null;
    var setName = function(name) {
      objectName = name;
    };
    var getName = function() {
      return objectName;
    };
    return {
      SetName: setName,
      GetName: getName
    };
  };
});

然后您可以这样实例化:

var tstA = new TestFactory();
var tstB = new TestFactory();

服务和工厂是单身人士,因此我认为您可以通过提供更适当使用工厂来实现自己想要的东西,通过提供Init功能,该函数返回常见代码和唯一名称,例如:

angular.module('app')
       .factory('ServiceFactory', serviceFactory);
function serviceFactory() {
    return {
        Init: function (name) {
            return {
                objectName: name,
                setName: function (name) {
                    this.objectName = name;
                },
                getName: function () {
                    return this.objectName;
                }
            };
        }
    };
}

这使使用它作为可以初始化多种类型的工厂的可能性。

您基本上需要创建一个简单的getter/setter。

angular.module('app', [])
  .controller('TestController', testController)
  .service('serviceFactory', serviceFactory);
testController.$inject = ['serviceFactory'];
function testController(serviceFactory) {
  serviceFactory.set('A', {
    name: 'test A'
  });
  serviceFactory.set('B', {
    name: 'test B'
  });
  console.log(serviceFactory.getAll());
  console.log(serviceFactory.get('A'));
  console.log(serviceFactory.get('B'));
}
function serviceFactory() {
  var 
  _model = {
    name: ""
  },
  _data = {};
  return {
    set: function(key, data) {
      _data[key] = angular.extend({}, _model, data);
    },
    get: function(key) {
      return _data[key];
    },
    getAll: function() {
      return _data;
    }
  }
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<body ng-app="app" ng-controller="testController"></body>

最新更新