AngularJS: несколько контроллеров для просмотра

0

В настоящее время я играю с шаблоном MVC, используя AngularJS. Я немного смущен между контроллером, моделями и представлениями. До сих пор я понял, что в шаблоне MVC мы имеем следующие три:

1) Модель: Модель - это любая логика или база данных или сами данные. В anguarljs модели создаются с использованием фабрик или сервисов.

2) Представления: представление о том, как наши данные представлены или отображаются пользователю. Это просто представляет нашу модель для пользователя.

3) Контроллер: Контроллер - это то, что контролирует. Как написано на Coding Horror, контроллер - это мозг приложения. Контроллер решает, что вводит пользователь, как должна изменяться модель в результате этого ввода, и какой результат следует использовать.

Поэтому, глядя на определение контроллера, я могу сказать, что контроллер - это босс. Он будет отвечать за все, что произойдет. В моем приложении у меня есть пара моделей, таких как проект, форма, заметка и т. Д. То, что я делаю, я создал factories для каждой модели. например ProjectFactory, ShapeFactory, NoteFactory. И я создал controller для каждого из них, т.е. ProjectController, ShapeController, NoteController для управления материалом, касающимся проекта, формы и примечания. Я не уверен, правильно это или нет.

В моем приложении у меня есть пара видов, а именно map-view.html, project-view.html. Для каждого вида есть контроллер MapViewController, ProjectViewController. Для моего проекта нужны проекты и заметки. Поэтому мне нужно использовать ProjectViewController, ProjectController, NoteController в моем проекте-view.html. Я не знаю, как я могу это сделать. Я могу создать лестницу контроллера следующим образом:

<div ng-controller="ProjectController">
    <div ng-controller="NoteController">
        <div ng-controller="ProjectController">
        Project view goes here
        </div>
    </div>
</div>

Но это не очень хороший способ сделать это завтра. У меня будет большое количество моделей, поэтому я не могу создать эту лестницу, а также получить доступ к сфере действия родителя будет боль в спине. Это будет выглядеть так:

$socpe.$parent.$parent.$parent.data='Set data.'

Antoher apporach заключается в том, что я могу создавать сервисы, такие как ProjectService, ShapeService и NoteService, и использовать эти службы в ProjectViewController. Но это приводит меня к путанице, поскольку все материалы, которые будут обслуживаться этими services должны обрабатываться controller и эти контроллеры должны использоваться в нескольких местах/представлениях. Правильно ли это, или контроллеры, которые я имею в виду, контроллеры angularjs отличаются от контроллера шаблонов MVC? Я испорчен всеми этими понятиями.

  • 1
    Последнее является правильным подходом, на мой взгляд. Один вид, один контроллер и ввод нужных вам сервисов. Это держит все красиво и чисто.
  • 0
    Последний приводит меня к этому stackoverflow.com/questions/36257080/…
Показать ещё 1 комментарий
Теги:
model-view-controller

1 ответ

1

Вместо этого попробуйте использовать директивы,

<div ProjectDirective>
    <div NoteDirective>
        <div>

        </div>
    </div>
</div>

Таким образом, вы получаете возможность предоставить mvc для каждой директивы, и вы можете иметь эти изолированные для каждой директивы. Гораздо проще организовать.

Пример директивной функции,

        // Code goes here
var app = angular.module('demoApp', []);


(function(angular) {
  'use strict';

  var projectDirective = function() {
    function controller() {
      this.hello = 'I am from project directive.';
      console.log('Not sure why this is not getting called');
    }

    function link() {
    }

    return {
      restrict: 'EA',
      link: link,
      controller: controller,
      template: '<div>{{ctrl.hello}}<span ng-transclude></span></div>',
      //templateUrl: 'xxx.html',
      controllerAs: 'ctrl',
      bindToController: true,
      transclude: true,
      scope: {}
    };
  };
  app.directive('projectDirective', [projectDirective]);
})(angular);

(function(angular) {

  app.controller('ViewController', ['$scope', function($scope) {
    $scope.greeting = "I am from ViewController";
  }]);
}(angular));
  • 0
    Извините, что беспокою вас. Я учу эти вещи. Как я получу доступ к методам, которые определены в контроллере projectDirective в ProjectViewController. Можете ли вы предоставить plunkr?
  • 0
    Вы должны прочитать угловые документы. Вы можете получить доступ к методам директив в основном внутри начального и конечного тегов шаблона директивы или тегов директивы.
Показать ещё 5 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню