Несколько шагов (мастер) с помощью ui-router?

Question

Я пытаюсь построить многоступенчатую форму (мастер) с угловыми js.

Как я понимаю, я должен сопоставить каждый шаг с собственным контроллером и видом (шаблоном). Но мне кажется, что если я это сделаю, модель, определенная в каждом представлении шага, будет ограничена только областью конкретного контроллера.

Поскольку я хотел бы представить все данные, заполненные всеми шагами в конце формы, интересно, как я должен код, чтобы убедиться, что модели (ы) разделены на всех этапах?

Answer 1

Что я хотел бы предложить вам, это разоблачить вашу модель на каждом шаге с помощью службы \ factory. Каждый шаг может получить доступ к модели, выставленной на заводе, и обновит эту модель. Ваша фабрика будет выглядеть как-то

angular.module("myApp").factory("Wizard",[function() { 
    function WizardModel() { 
     //Model Properties 
     this.title="Test" 
    } 
    var wizardService={}; 
    wizardService.model=new WizardModel(); 
    wizardService.init=function() { 
     //instantiate a new model object wizardService.model={}; 
    } 
    return wizardService; 

}]) 

Теперь вы можете ввести эту услугу в свой контроллер. Перед запуском мастера введите init, чтобы повторно инициализировать модель и использовать свойство model, чтобы получить текущую модель.