4

这是一个 angularjs 应用程序。我有一个处理内容加载的服务（ajax）。当服务获取内容时，整个应用程序中的许多内容会隐藏，稍后会再次显示（取决于返回的内容）。它们可能具有相同的范围，不同的范围，等等。他们只需要在内容加载时隐藏，然后在加载完成时显示。很正常的东西。

现在，我有单独的控制器监视服务的“加载”属性并使用常规角度指令（ng-show、ng-hide 等）来显示/隐藏。但这感觉有点矫枉过正。我更喜欢编写一个自定义的“加载”指令来注入加载服务并进行观察和显示/隐藏。

我的问题是：我想做的事情是“坏的”吗？控制器的方式，我最终会样板化一堆代码，可能高达 5 或 6 次，甚至随着应用程序的增长甚至更多。自定义指令方式，我编写一次并在需要的地方使用属性。是的 - 对这项服务有依赖性，但这并不像是世界末日，有些人让我开始认为我应该认为它是世界末日。

对于它的价值，我觉得我已经听过很多次“关注点分离”了，我已经被它麻痹了。它导致我过度思考一切，因为我想以正确的方式做事，但它肯定不会让人觉得我很有效率。

4

2 回答 2

5

如果我理解正确，你有一堆元素应该在特定服务加载数据时隐藏，然后在加载数据时再次显示，对吧？

在这种情况下，事件可能是一个很好的解决方案：

  • 它们对于应用程序来说可以是全局的（我认为这就是你所要求的）。
  • 它们允许避免元素之间的直接耦合（也是您关注的问题之一）。

因此，在您的服务中，只需在事情发生时广播事件：

$rootScope.$broadcast('loading-data');
axajStuffOrWhatever(function() {
   $rootScope.$broadcast('data-loaded');
});

然后，将显示/隐藏行为包装在将侦听这些事件的指令中。

.directive('hideWhileLoadingData', function() {
  return {
    link: function(scope, el, attrs) {
      scope.$on('loading-data', function() {
        el.css('display', 'none');
      });
      scope.$on('data-ready', function() {
        el.css('display', 'block');
      });                
    }
  };  
});

使用指令：

<div hide-while-loading-data>something</div>

在这里使用事件的好处是，稍后它们可以由不同的服务或多个服务发起，只要事件相同，指令就不会受到影响。

对于更复杂的行为，您还可以参数化事件和指令，因此不同的元素将对不同类型的东西做出反应。

我已经做了一个例子。

于 2013-05-31T18:50:24.547 回答
0

在我看来，依赖此服务的所有范围都应该是一个父范围的子范围。如果您有负责与服务对话的父作用域，那么任何作用域的任何指令都可以$parent通过$scope.

于 2013-05-31T14:09:30.897 回答