I'm building an Angular application with a login page. The login page contains the following elements: Login form Password forgot form Password forgot acknowledge message Password reset form (you end up here after clicking the link sent by e-mail) Loading spinner At first, the login form should be presented. When you click the forgot my password link, the login form should disappear and the password forgot form should appear in which a user can enter his email address and press a button to request a new password. Next on, the user is presented the password forgot acknowledge message with text stating what is going to happen next. When the user clicks the link sent by e-mail he is redirected to the login page again and presented with the password reset form where he can enter his desired password. What I have currently done is written all divs successively in the login.component.html page. By default all are hidden except for the login form using (example) *ngIf="forgotpassword" [@fadeInOutRight]. Then, based on buttons or links clicked on the page dynamically divs fly in and out of the screen using Angular Animations. I was wondering if this is good practice or if there's any other technique that should be used to dynamically change the content of the page. Any tips are much appreciated. Thanks! Continue reading...
