angularjs – 是否有可能使用$rootScope作为商店在Angular 1中实

让我们来看看：

// reducer-like
$rootScope.$on('COUNTER_INCREMENT',(e,action) => {
   //I don't use += to emphase immutability of count property;
   $rootScope.count = $rootScope.count + action.value;
});

//action-ish creator
$rootScope.$broadcast('COUNTER_INCREMENT',{value: 5});

//store subscribe-like
$rootScope.$watch('count',(count) => {
  //update something in your component
})

如果你愿意,你可以这样做,但你会发现存在不明确的不变性问题.很难控制你的动作处理程序是纯粹的,因为实际上并非如此.

没有默认的动作处理程序,您无法轻松设置存储的初始状态.你仍然使用$watch和digest,你可能想要避免.

此外,你不能订阅所有的更新,没有一个点重置像Redux这样做的所有时间旅行的东西.

如果你想继续使用Redux作为模式,你可能会以一些帮助程序结束,这将使你的代码更像Redux.

那么,为什么不从一个简单的角度效用服务开始使用Redux：

angular.module('app',[]).factory('store',() => {
  //if you have many reducers,they should be as separate modules,and imported here
  function counter(state = 0,action) {
    switch (action.type) {
      case 'INCREMENT':
        return state + action.value;
      default:
        return state;
    }
  }

  // here you can add here middlewares that make Redux so powerful
  return Redux.createStore(counter);
});

开始了.现在,您可以使用商店服务进行操作

angular.module('app').controller('MyController',($scope,store) => {
  store.subscribe(() => {
    //you may not to care about $scope.$digest,if your action was triggered within angular scope as well 
    $scope.count = store.getState();
  });

  $scope.onClick = () => store.dispatch({type: 'INCREMENT',value: 1});
});

现在,您有一个正确的设置,您的订户不知道导致调度的操作,您的操作创建和操作减少逻辑完全独立,因为它需要Redux模式.