Angular: взаимодействие контроллера и директивы с разделением задач

У меня есть модуль AngularJS, который определяет красивую директиву, которая может отображать сцену WebGL из атрибута scr="filename". Это работает хорошо и (отрезано здесь и там) выглядит примерно так:

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? Тогда как это сделать?

Просто предположение, должен ли контроллер просто «вращаться», не зная, что он вращается? И как тогда директива должна это уловить?

Или, наоборот, контроллер может редактировать scope.scene? Тогда у меня вопрос, как мне вырваться из изоляции?


javascript angularjs separation-of-concerns
person Paul    schedule 10.06.2015    source источник
comment
Вы настроили изолированную область с помощью src, так почему вы используете attrs.src, а не scope.src? И поскольку вы настроили изолированную область видимости, контроллер не сможет обновлять scope.scene, поскольку у него нет к нему доступа.   -  person Abhishek Jain    schedule 10.06.2015
comment
Чтобы расширить комментарий @AbhishekJain, вот документация для изолированной области действия docs.angularjs.org/guide/. Отсюда вы связываете 2 вместе в представлении с помощью атрибутов   -  person major-mann    schedule 10.06.2015
comment
Это не было намеренно, кроме того, что я думал, что должен использовать '=', чтобы у меня было два объекта ng-three в одном контроллере. Возможно, я неправильно понял руководство.   -  person Paul    schedule 10.06.2015
comment
Если подумать, если контроллер вращается, то, вероятно, нет смысла иметь несколько объектов ng-three. Спасибо! Я пока не понимаю значений & и @, но я рассмотрю их в руководстве.   -  person Paul    schedule 10.06.2015
comment
Я бы добавил в директиву шаблон и контроллер. Если вы это сделаете, ваша директива сама по себе станет независимым модулем, и вам не придется беспокоиться ни о чем другом, кроме общей области видимости между директивой и остальной частью вашего приложения.   -  person Joao Leal    schedule 10.06.2015

Ответы (1)


arrow_upward
1
arrow_downward

Я бы поместил логику сцены (включая загрузку / синтаксический анализ) в собственный service (или несколько, один для json-синтаксического анализа и один для вращения и т. Д.). Я не вижу проблем с conroller передачей объекта scene в service, он просто не должен содержать конкретной логики для него, так как его роль должна заключаться в посредничестве между service, содержащими логику, и view.

Для определения объема я бы создал экземпляр SceneController (например) для директивы с параметрами controller и controllerAs и прикрепил сцену к этому controller. Таким образом, SceneController - это особый controller, обеспечивающий богатый обзор и элементы управления для scene.

person LionC    schedule 10.06.2015