AngularJS中的动态服务策略

发布时间：2020-12-17 18:03:37 所属栏目：安全来源：网络整理

导读：如何在运行中切换服务并将所有组件(依赖服务)自动绑定到新策略上的数据？我有一个存储服务和两个存储策略,StorageStrategyA和StorageStrategyB.存储为控制器和其他组件提供公共接口以与之交互： angular.module('app').factory('Storage',function ($inject

如何在运行中切换服务并将所有组件(依赖服务)自动绑定到新策略上的数据？

我有一个存储服务和两个存储策略,StorageStrategyA和StorageStrategyB.存储为控制器和其他组件提供公共接口以与之交互：

angular.module('app').factory('Storage',function ($injector) {
    var storage;
    var setStrategy = function (name) {
        storage = $injector.get(name);
    };

    setStrategy('StorageStrategyB');

    return {
        getItems: function () {
            return storage.getItems();    
        }
        // [...]
    };
});

但是当策略更改时,双向绑定会中断,并且视图不会使用来自新策略的getItems()项目进行更新.

我创建了一个Plunker来说明问题.

有没有办法将策略模式与AngularJS结合起来并保持双向绑定？

请注意,在我的实际应用程序中,我不能在策略更改后再次调用Storage.getItems(),因为有多个组件(视图,控制器,范围)依赖于存储并且服务更改会自动发生.

编辑：
我有forked the Plunker突出问题.如您所见,上部的数据仅更新,因为我在策略更改后再次手动调用Storage.getItems().但我不能这样做,因为其他组件 – 例如OtherController – 也访问存储上的数据,还需要自动从新策略中获取数据.相反,他们仍然坚持初始战略.

解决方法

Javascript适用于引用.应用程序中的数组项目与最初使用以下语句的strategyB项目项目相同,当您自动更新StrategyB项目时,视图中的项目将更新(自相同参考).

$scope.items = Storage.getItems();

因此,当您切换策略时,您不会更改项目的引用.它仍然指向StrategyB项目参考.

您必须使用以下机制来更改引用.

然后你可以做一些事情,你可以在控制器之间communicate更改项目参考.

请找到我已更新的plunkr.

$rootScope.$broadcast("updateStrategy");

然后更新您的项目列表和其他人.

$scope.$on("updateStrategy",function(){
  $scope.name = Storage.getName();
  $scope.items = Storage.getItems(); //Here changing the reference.
  //Anything else to update
});

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!