向导结构设计 - HiJohns/UFlying GitHub Wiki

使用简例

引用方法

<com-wizard config="wizardConfig"></com-wizard>

向导配置

$scope.wizardConfig = {
cards: [
       { 
           path: 'insurance/components/editor/form/FormPingan360.html', // 页面定义文件路径
           controller: 'comEditorForm', // 控制器
           name: 'form', // 英文名
           title: '填写保单', // 标题
           form: "insuranceForm" // 如果有表单则填写表单名,可选
       },
       { 
           path: 'insurance/components/editor/confirm/Confirm.html', 
           controller: 'comEditorConfirm', 
           name: 'confirm', 
           title: '提交' 
       }],
    model: 'modFormsPingan360', // 向导的目标模型
    active: 0  // 指定当前页,缺省为0
};

逻辑关系

  • 各域关系为:视图域<-向导域<-页域<-页内容域
  • 视图域中给定向导配置。
  • 向导域负责创建并保持数据模型,负责完成页面切换,在向前切换时:
  • 将当前页的数据写入数据模型
  • 从数据模型中读取新的当前页的数据并注入到页域(data)
  • 页域负责触发前进后退事件,在前进事件中,提交自己当前的数据
  • 页内容域为各页面的自定义内容。