AngularJS Einzelansicht mit Mehrfachform Modal

Question

Ich vertraue darauf, dass es Ihnen allen gut geht. Es gibt ein bisschen Logik, ich brauche Hilfe herauszufinden, und ein Beispiel, um mir zu helfen, das Konzept ziemlich gut zu greifen.

Ich habe eine Anmeldeansicht wie unten gezeigt.

Je nach ausgewählter Schaltfläche wird ein Anmeldeformular modal angezeigt. Unter der Annahme, der Werbetreibende Schaltfläche geklickt wird, sieht die Form wie auf dem Bild unten

Jedoch sollte ein influencer Klicken Sie auf diese andere Form mit einer anderen sozialen Anmeldungen oder Form Anmeldungen in einem Assistenten nach oben ziehen, wie unten zeigt. in einem Parse der Formulareinträge in eine Datenbank nehme ich

Jede der beiden obigen Formen ist eine Form-Assistent und der abschließende Schritt zur Folge haben sollte.

Ich möchte dies alles in einer einzigen Ansicht haben, aber selektiv, um die jeweilige Auswahl abhängig von den ausgewählten Kriterien anzeigen zu können.

Wie durchführbar ist es, das Obige zu erreichen und wie sollte meine Logik strukturiert und realisiert werden. Ich weiß irgendwie, dass ich Panel, Dialoge und einige Funktionen verwenden muss, aber nicht alles zusammensetzen kann. Wird jede Hilfe, die angeboten werden kann, zu schätzen wissen.

Danke.

Answer 1

Sie müssen nur die app.js Datei ändern, wo Sie Ihre

Routing tun

   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'); 
       }); 

Und in Datei index.html im Body-Tag

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