0

For my project, I'm trying to create dynamic component with a template in a string which contains multiple variable. So I'm using this answer: angular2 generate component from just a string

And it works well to display my data in my template. But, I can't use directive like ngIf, ngModel etc... I have the classic error: "NG0303: Can't bind to 'ngIf' since it isn't a known property of 'span' (used in the 'DynamicComponent' component template)."

I import well CommonModule and FormsModule of course.

                    const tmpCmp = Component({ template: myTemplate })(class { });
                    const tmpModule = NgModule({ declarations: [tmpCmp], imports: [CommonModule, FormsModule] })(class { });


                    const mod = this._compiler.compileModuleAndAllComponentsSync(tmpModule);
                    const factory = mod.componentFactories.find((comp) =>
                        comp.componentType === tmpCmp
                    );
                    const cmpRef = factory.create(this._injector, [], null, this._m);
                    cmpRef.instance.name = `dynamic_${j}`;
                    cmpRef.instance.data = this.data[j];
                    this.listVc.get(j).insert(cmpRef.hostView);

I'm on Angular 14 by the way.

My template looks like:

<div class="ui-grid-cell-contents text-center"> 
<input [value]="data.lastName">
<span *ngIf="data.teletrav" class="glyphicon glyphicon-ok-circle"></span>
</div>

Thanks

8
  • What does your DynamicComponent look like? Do you need to import CommonModule into the hostView aswell? Commented Jan 12, 2023 at 9:50
  • Please update your question. Commented Jan 12, 2023 at 9:59
  • Can you provide your issue with a stackblitz? Commented Jan 12, 2023 at 10:17
  • I made this: stackblitz.com/edit/… But on stackblitz, it's working well... Commented Jan 13, 2023 at 9:16
  • Cant you take the new code from stackblitz? There are even different things used between your question and stackblitz Commented Jan 13, 2023 at 13:37

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.