1

I have a Angular 2 application which has 15+ Angular 2 components created dynamically. Using idea from below link.

Load existing components dynamically Angular 2 Final Release

For e.g. First screen is available with 2 buttons. On click of first button I should see second screen and on second button click I should see 3rd screen and so on. As mentioned earlier I have 15+ such screens so multiple permutations/ combinations are as possible depending upon what use gives on the current screen.

In short its kind of business rules engine which implements certain flow for the application. Is this something possible in Angular2 given components are generated dynamically? Please help/advise.

More Elaboration

Consider this task to be a loan application which is to be filled by loan applicant/user. He will be presented with set of screens pertaining to his 1. Personal information (PAN#, Address, Married? 3-4 screens or in this case components) 2. His other liabilities (1-2 components) 3. His earnings (1-2 components) 4. and so on.
Now I take first set of screens 1. Personal Information - 1st Component- Name, Address Zip code. 2nd Component- PAN# 3rd Component- Are you married and filling jointly? Here if says Yes I will present 1st and 2nd screen again to ask spouse details and if No I will go to some other component or set of screens. This logic is something I am naming as rules/business logic and questions is about how to build this with dynamic loading of components and keeping this rules outside of my application such as in the metadata file?

Community
  • 1
  • 1
user12345
  • 261
  • 3
  • 14
  • your question scope is very broad. can you elaborate a bit more or be specific what exactly you want? I might help you regarding this dynamic components loading – Qaisar Nadeem Feb 28 '17 at 07:01
  • @Qaiser - Thanks for the update. I have updated my question with practical example. Hope that helps to understand the situation. – user12345 Feb 28 '17 at 17:14
  • @Qaiser - If I could add to above. Consider this example http://plnkr.co/edit/nfxohn1y9bZRZoGAweWz?p=preview where the different UI Components are loaded dynamically based on the information in app.ts file. All this UI Components are like screens which I want to show one by one and need navigation between them using Router or something. Please advise. – user12345 Feb 28 '17 at 19:40
  • You can use `NgComponentOutlet` to load component dynamically. It was introduced in *4.0.0-beta.3* and onward. Here is a plunker which describes how to use it. https://plnkr.co/edit/kwrjr2vIVb0Bfda4FUa0?p=preview – Qaisar Nadeem Mar 02 '17 at 06:31

0 Answers0