Angular: controller-directive interaction with separation of concerns

Question

我有一个 AngularJS 模块，它定义了一个很好的指令，可以显示来自 scr="filename" 属性的 WebGL 场景。这很好用并且（在这里和那里剪断）看起来大致像这样：

angular.module('ThreeViewer', [])
.directive('three', ['$http', function ($http) {
  return {
    link: function (scope, element, attr) {
      scope.renderer = new SceneRenderer(element[0])
      $http.get(attr.src)
      .success(function (json) {
        var loader = new THREE.ObjectLoader()
        var scene = loader.parse(json)
        this.scene = scene
        this.renderer.setScene(scene)
      }.bind(scope))
    },
    restrict: 'AC',
    scope: {
      src: '='
    }
  }
}])

所以它所做的是加载场景，将其保存到范围，并将其传递给渲染器。这行得通。

现在我想创建一个控制器，以便用户可以与数据交互，比如旋转对象。我的问题是，在坚持 Angular 关注点分离范式的同时，应该如何处理这个问题？据我了解，在 Angular 中，控制器应该能够在没有指令的情况下工作，反之亦然——彼此之间一无所知。这是否意味着控制器不能直接修改 scope.scene 对象？那怎么办呢？

只是猜测，控制器是否应该 "rotate" 不知道它在旋转什么？然后指令应该如何选择它？

或者，控制器是否可以编辑 scope.scene？那么我的问题是如何打破隔离？

Answer 1

我会将场景逻辑（包括 loading/parsing）放入自己的 service（或多个，一个用于 json-解析，一个用于旋转等）。我认为 conroller 将 scene 对象传递给 service 没有问题，它不应该包含特定的逻辑，因为它的作用应该只是在 [=10= 之间进行调解]s 包含逻辑和 view.

对于范围界定，我将使用 controller 和 controllerAs 参数为指令实例化一个 SceneController（例如），并将场景附加到该 controller。这样，SceneController 就是一个特定的 controller，可为 scene.

提供丰富的视图和控件

Angular: controller-directive interaction with separation of concerns

Angular: controller-directive interaction with separation of concerns

javascript

angularjs

separation-of-concerns