AngularJS: разные виды и разные контроллеры по данным

Question

Предположим, я хочу создать страницу викторины. У меня разные типы вопросов. То есть задача состоит в том, чтобы найти правильный порядок, выбрать один ответ, выбрать несколько ответов или заполнить пробелы предопределенными словами и так далее. Итак, у меня есть 5 вопросов в контексте данных. 2 из них имеют множественный выбор, 1 - вопрос правильного порядка, а второй 2 - клозы. Главное: я не знаю, сколько разных типов вопросов находится в текущей викторине. Все они нуждаются в собственном представлении, собственном контроллере и собственной модели данных, потому что нет универсальной модели данных, которая применяется одновременно для клонов и вопросов правого порядка (исправьте меня, если я ошибаюсь).

Каков наилучший способ для AngularJS и MVC-шаблона в целом для этого? Это даже применимо? Это противоречит шаблону MVC вообще?

Answer 1

То, как мы это делаем, это начать с данных. Большинство наших разделов имеют только один тип вопросов, но у нескольких может быть два или более типов вопросов. Каждый тип вопроса имеет factory, который может принимать JSON, который начинался как XML, и запускался через процесс преобразования и добавлял во все «крючки» каждый вопрос. У нас есть что-то, называемое "questionBuilder", которое смотрит на имущество questionType на каждый раздел и смотрит в $injector для questionType + 'Factory'.

Редактировать: вы можете думать о строителе, как о том, когда вы заказываете что-то из Amazon. Амазонка не знает, как сделать кофейник или банку теннисных мячей. То, что у него есть, - это длинный список поставщиков, который do умеет делать эти вещи. Поэтому, когда вы заказываете у Amazon, он входит в список фабрик, которые поставляют эти вещи, вытаскивает тот, который может сделать кофейник, и спрашивает фабрику для кофейника. Затем он вставляет его в коробку и отправляет его вам.

Угловой как ИБП. Он не знает и не заботится о том, что находится в коробке. Когда вы дойдете до представления, вы вытащите ящики, на которые вы сейчас волнуетесь. Ваш вид понимает тип вопроса (точно так же, как вы знаете, как использовать этот кофейник, или вы можете узнать).

Удобно, Угловой также как и список поставщиков (или инжектор). Все, что знает инжектор $, вы можете вытащить в своем застройщике, так как вы можете иметь любые фабрики, которые вам нужны, не загромождая ваш код кучей логики, чтобы жестко закодировать зависимости на конкретных фабриках. Вы смотрите в форварде $ для фабрики, который соответствует типу вопроса, указанному в данных.

Если в разделе указано более одного типа вопросов, мы указываем «составной» для questionType. CompositeFactory рассматривает свойство каждого вопроса, чтобы выяснить, где искать в $injector для завода. Он также рассматривает информацию в этом разделе, в которой говорится, что она добавляет свойство к каждому вопросу, который сообщает о представлении далее в строке, частичной для использования в ng-include.

Каждый тип вопроса имеет свой собственный каталог функций, содержащий модуль, в котором говорится, какие маршруты соответствуют тем представлениям, которые идут с этой функцией (некоторые из наших типов вопросов имеют разные варианты, основанные на потребностях клиента). Композитная функция имеет единый вид, который в основном просто втягивает часть ng-include, которая была добавлена ​​ранее на фабрике. Частично может быть либо непосредственно что-то из одного из каталогов функций, либо оболочка для одной из директив-функций, в зависимости от того, что нам нужно и как оно было изначально построено.

Answer 2

У вас есть 5 вопросов, я бы сделал ng-repeat по вопросам и ng-switch на каждом из видов, которые вы хотите.

<div ng-repeat="question in questions" ng-switch="question.questionType"> 
    <div ng-switch-when="MultipleChoice" ng-controller="MultipleChoiceCtrl"> 
    ... multiple choice 
    </div> 
    <div ng-switch-when="RightOrder" ng-controller="RightOrderCtrl"> 
    ... right order 
    </div> 
</div>