Question

我相信你们都很好。我需要帮助找出一些逻辑，以及一个帮助我很好地掌握这个概念的例子。

我有一个注册视图，如下所示。

根据所选按钮，注册表单以模式显示。假设单击了广告客户按钮，表单如下图所示

但是，影响者按钮点击应该在向导中使用备用社交注册或表单注册来提取另一个表单，如下所示。

上面两个表单中的任何一个都是一个表单向导，结束步骤应该导致将表单条目解析为我认为的某个数据库。

我希望所有这些都在一个视图上，但是有选择性，以便能够根据所选的标准显示相应的选择。

实现上述目标的可行性如何，我的逻辑应该如何构建和实现。我知道我将不得不使用面板，对话和一些功能，但不能把它们放在一起。将欣赏可以提供的每一个帮助。

感谢。

Answer 1

您只需要更改正在进行路由的app.js文件

                var app = angular.module('demoapp', ['ui.router']);
                app.config(function ($stateProvider) {
                    $stateProvider
                           .state('sign_up', {
                                url: '/sign_up',
                                views: {
                                    loginContent: {
                                        templateUrl: 'app/sign_up/sign_up.html',
                                        controller: 'sign_upCtrl'
                                    }
                                }
                            })
                          .state('sign_up.firstPage', {
                                url: '/sign_up-firstPage',
                                views: {
                                    loginContent: {
                                        templateUrl: 'app/sign_up/firstPage.html',
                                        controller: 'firstPageController'
                                    }
                                }
                            })
                          .state('sign_up.secondPage', {
                                url: '/sign_up-secondPage',
                                views: {
                                    loginContent: {
                                        templateUrl: 'app/sign_up/secondPage.html',
                                        controller: 'secondPagePageController'
                                    }
                                }
                            })
                }).run(function ($state){
                    $state.go('sign_up');
                });

在body标签的index.html文件中

        <div ui-view="header"></div>
         <div ui-view="loginContent"></div>
         <div ui-view="footer"></div>

具有多个表单模式的AngularJS单视图

1 个答案: