Question

我的应用程序有两个执行路径。

Root
 |
 |---Tool1 --> T1Page 1
 |         --> T1Page 2
 |
 |---Tool2 --> T2Page 1
 |         --> T2Page 2
 |
 |----Factory (F)

此处 T1Page2 和 T2Page2 具有类似的UI元素，我为此定义了工厂。现在问题是，如果用户首先启动Tool1然后导航到Tool2，则在 T2Page2 中显示在 T1Page2 中选择的值。这显然是因为控制器中的单例注入。当用户访问 T2Page2 时，如何确保Angular返回新的工厂对象。

我能想到的一个解决方案是在工厂中添加一个清理方法，并在用户启动 T2Page2 时调用它。但这对我来说听起来不太好。

厂

(function () {
var serviceId = 'setUp';
angular.module('app').factory(serviceId , ['common', 'datacontext']);
function setUp(common,datacontext){
var vm = this;
vm.name='';
vm.address='';
return init();

 function init() {
      return vm;
  }
}
}());

T1Page2 Controller 1

(function () {    
    var controllerId = 'T1Page2';
    angular.module('app').controller(controllerId, ['common', 'datacontext', 'setUp', T1Page2]);

function T1Page2(common, datacontext, setup) {
   //code omitted
  }
}());

T2Page2 Controller 2

(function () {    
    var controllerId = 'T2Page2';
    angular.module('app').controller(controllerId, ['common', 'datacontext', 'setUp', T2Page2]);

function T2Page2(common, datacontext, setup) {
   //need a new setUp object here. 
   // rest of the code omitted
  }
}());

Answer 1

我想说你的问题有两种可能的解决方案。

解决方案1

使用Angular Service而不是Factory。虽然工厂维护一个持久状态（在加载模块时它是新的），但服务会根据您的需要为您返回一个新的构造函数（您可以为每个工具创建一个新服务）。

样品服务：

angular.module('app').service('MyService',
  function () {
    this.name = '';
    this.address = '';
  }
]);

在控制器中使用服务（例如）

$scope.myService = new MyService();

解决方案2

创建2个工厂。 Tool1的一个工厂和Tool2的另一个工厂。

在您的情况下，解决方案2可能更容易，因为您希望一组页面使用服务（在一般意义上使用），而第二组页面需要不同的持久状态对象。

AngularJS：共享公共工厂来创建一个新对象

1 个答案: