如何使用带有角度ui jquery passthrough的指令内的步骤来获得formwizard?

tes*_*123 3 jquery-form-wizard angularjs angular-ui

我已经使用表单向导尝试了角度的jquery passthrough,它运行得很好.现在,我有一个问题.当formwizard中的步骤位于指令内时,jquery passthrough似乎不起作用(显示所有步骤而不是仅显示第一个步骤):

<form ui-jq="formwizard" ui-options="{formPluginEnabled: false, validationEnabled: false, focusFirstInput : false,  disableUIStyles : true}" ng-submit="create(currentActivity, selectedCategories)" class="main">
                    <!--STEP 1 -->             
                    <div activity-wizard-step title="Class Activity Info" description="Add all info about the activity" src="resources/angular/templates/activity_wizard/activity_info.html" step-number="1"></div>

                    <!-- STEP 2 -->
                    <div activity-wizard-step title="Add Class(es)" description="dd Instructor-Led-Training (ILT) Classes below. It can be a classroom ILT or a Webinar ILT and contain 1 or more sessions." src="resources/angular/templates/activity_wizard/add_class.html" step-number="2"></div>

</form>
Run Code Online (Sandbox Code Playgroud)

这是我的activityWizardStep指令的样子:

directivesModule.directive('activityWizardStep', function () {
    return {
        replace: true,
        restrict: 'AE',
        scope: {
            title: '@',
            description: '@',
            src: '@',
            stepNumber: '@'
        },
        templateUrl: 'resources/angular/templates/activity_wizard/wizard_step.html'
    }
});
Run Code Online (Sandbox Code Playgroud)

和wizard_step.html:

<fieldset class="step" id="step{{stepNumber}}">
    Some html
</fieldset>
Run Code Online (Sandbox Code Playgroud)

就像我之前说的那样,所有步骤都会一直显示.我认为这是某种计时问题,比如指令或者当jquery passthrough尝试初始化formwizard时,include不在dom中.这是发生了什么?如果是这样,我应该使用$ timeout吗?如果是这样,我会把它放在哪里.也许有更好的方法.有什么想法吗?

tes*_*123 9

答案是,不要使用带有angularJS :)的formwizard.在看了这个进一步的ng-switch后,不仅可以完成工作,还可以简化很多工作.

<form ng-switch="navStep" class="main">
    <!--STEP 1 -->             
    <div ng-switch-when="activity_info" activity-wizard-step title="Class Activity Info" description="Add all info about the activity" src="resources/angular/templates/activity_wizard/activity_info.html" step-number="1"></div>

    <!-- STEP 2 -->
    <div ng-switch-when="add_class" activity-wizard-step title="Add Class(es)" description="dd Instructor-Led-Training (ILT) Classes below. It can be a classroom ILT or a Webinar ILT and contain 1 or more sessions." src="resources/angular/templates/activity_wizard/add_class.html" step-number="2"></div>

</form>
Run Code Online (Sandbox Code Playgroud)

然后在单击下一个和后退按钮时设置navStep.

基本上角的强大使得formwizard不必要.