angularjs - 在工厂中存储 $scopes

Question

我正在向并非我自己编写的 Web 应用程序添加功能。感觉不能加刷卡功能。

我在某处看到“无法在工厂中访问 $scope”，但我以某种方式设法将 ng-repeat 创建的所有范围存储在工厂中。由于 JavaScript 按值传递，我可能不是在“存储范围”，但如果我在工厂内设置范围 ng-class 我仍然可以清楚地看到差异。我认为这是个好主意，因为范围遍历很痛苦。我是挖到了金子还是浪费了速度和空间来存储范围内的海量数据？

HTML

main.html

<div ng-controller="someCtrlWhichWasDeclaredALongTimeAgo">
    .
    .
    . 
    <div class="items-container"
         ui-sortable="sortableOptions"
         ng-model="selectedSession.items">
        <div ng-repeat="item in selectedSession.items"
             ng-controller="itemEditorCtrl"
             ng-class="{'item-last':$last}">
            <div ng-if="item._value !== undefined"
                 class="item inline-comment">
                <span class="handle"></span>
            </div>
            <div ng-if="item._value === undefined"
                 class="item"
                 ng-include="'/views/item-editor.html'"></div>
            </div>
        </div>

        <div class="stopper"></div>
    </div>
</div>

项目编辑器.html

<div item-editor
     swipe-function="swipeMe"
     ng-swipe-left="swipeLeft(item)" 
     ng-swipe-right="swipeRight(item)">
     ...
</div>

这将使用我的魔术代码呈现一个列表。如果单击列表中的项目，它将扩展到全屏。您应该能够从那里在项目之间滑动。

我不认为我需要张贴更多的 HTML 来解释这个问题。我确实设法通过 $rootScope.$broadcast 实现了滑动，但是如果我的列表中有一百个项目怎么办？随着越来越多的项目接收消息并处理它们，它不会变得更慢吗？我宁愿在选择此 session 时将所有范围加载到一个工厂中，然后在取消选择 session 时将其删除。启动可能需要一些时间，但刷卡不需要 5 分钟。

Answer 1

你所做的一切都很好。您可以随意在您的应用程序周围传递范围对象。请记住它们代表什么。 $scope 对象是您与 View 的接口(interface)。大多数时候，您的服务与 View 关系不大，理想情况下应该用于在 Controller 和指令之间共享数据。也就是说，有几个例子表明服务间接影响 View 是完全有意义的。比如我们写了一个spinner service这允许微调器指令在服务中注册自己。

spinner 指令将 spinnerService 注入(inject)其中，调用 spinnerService.register 函数并传入其隔离范围，以便服务可以跟踪它并使用它来打开和关闭微调器。然后我们的开发人员可以在他们需要的任何地方注入(inject)服务，并在需要时隐藏/显示加载微调器或微调器组。

“无法在工厂中访问 $scope”的意思是您不能在工厂内注入(inject) $scope。 $scope 绑定(bind)到 DOM 元素(调用 Controller 或隔离指令的元素)，因此将新的 $scope 注入(inject)工厂没有多大意义事实上是不可能的。你不能做 app.factory('myFactory', function ($scope) { ... }); 但你绝对可以从 Controller 或指令调用你的工厂/服务并传递范围将对象从那里转化为您在服务中提供的方法。

只要您知道自己在做什么，在服务内跟踪范围就没有错。人们会告诉您不能将您的作用域传递给服务，因为它是一种反模式，但随后他们会建议将类似这样的内容放入您的指令/ Controller 中，然后将其传递给服务:

var api = {
  hideSpinner: function () {
    $scope.show = false;
  },
  showSpinner: function () {
    $scope.show = true;
  }
};

当然，您不是直接将您的 $scope 对象传递给服务，但是如果参数是您的范围对象可能会卡在内存中并且永远不会成为垃圾收集，此解决方案也无济于事。您构建和传递的 API 对象带有它的 JavaScript 范围链，将所有变量保存在它定义的范围内，包括您的 Controller /指令的 $scope。必须这样做，否则那些 API 方法将无法工作。您的 $scope 是该组件的一种 API，以这种方式使用它很好。

执行上述示例的一个更好的论据是，您的 $scope 对象可能包含您不需要/不想与服务共享的信息或功能。用你想暴露给服务的东西制作一个小的 API 对象是非常有意义的。然后你的服务只能访问你希望它访问的东西，并且仍然可以影响 Controller /指令 $scope，但只能以你传入的 API 对象概述的方式。