Angular - Best practice for multi components in the same "page"

[Max Bertoli]

Hi,

in my app i want to create a wizard form like.

The action is served just in this kind of url: http://mysite/create

When a user gets in create path is being shown the first step that consists of a request of title and description.

When a next button is pressed  this component is hidden and shown another one with second step, and so on.

It must be said, for example, that in the second step i will see the information of title and description, but in another appearance: not like a form, but as mere description text...

In general, in this kind of situation, is it common to turn on/off the components or there is some better strategy to work with?

thanks

Max

[Sander Elias]

Hi Max,

Depends on the complexity of the steps. But if you create a single component for each step, and you don't have too many steps, that's an easy way to cater for it.

You also could use the router, or, if this happens often, create your own steps-component that uses lazyloading to load's each step.

Regards

Sander

[Max Bertoli]

Hi Elias, Thanks for the answer.

I have to manage three step.

The first i ask title and description;

In the second one i show a list of items to select;

in the end i make some operation and i show another manageable component.

It's a creation of a tournament: title/description, choose players and generating groups: that's all.

In my mind these steps are similar a wizard and so i can show one at a time.

But i'm not sure and maybe i thought about an alternative...

What do you think since you have more details?

Thanks a lot.

Max

[Sander Elias]

Hi Max,

I think a simple ngSwitch based solution will work fine for this.

<container-element [ngSwitch]="onStep">
    <some-element *ngSwitchCase="1">...</some-element>
    <some-element *ngSwitchCase="2">...</some-element>
    <some-element *ngSwitchCase="3">...</some-element>
</container>

Something along those lines will do in this case I presume.

Regards

Sander

[Max Bertoli]

Well, i think is a good solution for my case…

 

Thanks a lot!!

Max

 

Da: ang...@googlegroups.com [mailto:ang...@googlegroups.com] Per conto di Sander Elias
Inviato: lunedì 29 maggio 2017 14:21
A: Angular and AngularJS discussion <ang...@googlegroups.com>
Oggetto: [AngularJS] Re: Angular - Best practice for multi components in the same "page"

--
You received this message because you are subscribed to a topic in the Google Groups "Angular and AngularJS discussion" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/BEVgjb92yBI/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.