1

Is there any way to get template rendered with data bound on angular2. eg: Model : 

{
    "level0": {
      "level0-child0": "Value",
      "level0-child1": "valuecheck",
      "level1": {
        "level1-child0": "check"
      }
    }
  }

from this model, if "level0-child0" is === Value, I want to display the template in ImageComponent.
similarly, if level0-child1 === valuecheck, I want to display the template in ImageOneComponent.
Is there an option of dynamically build template from Component-class!
What I have tried is: Have acheived a recursive call to each keys in JSON.. But I am looped with in searching for DynamicCompoentResolver
Where Image/ImageOneComponent are, two different components, with templates, <img src="image1"/>, <img src="image2"/> respectively

peaceUser
  • 457
  • 5
  • 19
  • What template? What `ImageComponent`. Please add more code. If you don't know what component statically, you can use something like http://stackoverflow.com/questions/36325212/angular-2-dynamic-tabs-with-user-click-chosen-components/36325468#36325468 – Günter Zöchbauer Oct 14 '16 at 10:26
  • Similar to that answer, but it seems in ng2 stable "ComponentResolver" is no more available..! by the way I need to combine the previous tree with this loading, if you look into the json, it is hierarchical. – peaceUser Oct 14 '16 at 10:37
  • That answer already uses the `ComponentFactoryResolver` instead of the removed `ComponentResolver`. – Günter Zöchbauer Oct 14 '16 at 10:45
  • @Gunter, tried changing the template to an and tried to bind model, it throws exceptions, is there a way to acheive data binding too on the aboce answer? – peaceUser Oct 15 '16 at 06:01
  • "throws exception" isn't very helpful. What exception? What code causes the exception? – Günter Zöchbauer Oct 15 '16 at 10:44
  • the exception is , [ngModel] , ngModel, (ngModel) etc are not valid format for 'input' tag is the exception. – peaceUser Oct 15 '16 at 11:59
  • Can you please copy-past the exact and full error message? Perhaps you are missing the `BrowserModule` (`AppModule` only) or `CommonModule` (for all other modules) in `@NgModule({ imports: [CommonModule]})` – Günter Zöchbauer Oct 15 '16 at 14:43
  • Error: Uncaught (in promise): Error: Template parse errors: Can't bind to 'ngModel' since it isn't a known property of 'input'. ("][(ngModel)]="type"/>") – peaceUser Oct 15 '16 at 14:52
  • Above error appears, when we change any template in any component to "", in the plunk http://plnkr.co/edit/UGzoPTCHlXKWrn4p8gd1?p=preview – peaceUser Oct 15 '16 at 14:53
  • The Plunker is empty. Can you please check again? – Günter Zöchbauer Oct 15 '16 at 14:56
  • Check now,I have edited and it is the same plunker that you have fiven in the answer.. – peaceUser Oct 15 '16 at 14:59
  • How can I reproduce the exception? – Günter Zöchbauer Oct 15 '16 at 17:01
  • Reproducing it will be, just change the template of a component from C1 to , it will throw exception – peaceUser Oct 17 '16 at 04:46
  • 1
    You need to add the `FormsModule` to `imports: []` of `@NgModule()` for `ngModel` to work. I also had to add a call to `detectChanges()` to work around another exception http://plnkr.co/edit/UGzoPTCHlXKWrn4p8gd1?p=preview – Günter Zöchbauer Oct 17 '16 at 05:42
  • Okay, thats a great turing point.. leme try on that...! – peaceUser Oct 17 '16 at 06:12

0 Answers0