[Fixed] How to add html element in to Angular Component

Issue

I have my custom component like this

@Component({
  selector: 'panel-top-page',
  template: `
    <div class="border-radius" nz-row [nzGutter]="5">

    </div>
  `,
})
export class PanelTopPageComponent extends BaseValueAccessor implements OnInit {

  ngOnInit(): void {
    
  }
}

And I use like this

 <panel-top-page nz-col nzFlex="auto" nz-row [nzGutter]="5">
     <div>Here I want to add my html element</div>
 </panel-top-page>

And my result don’t show and element inside
Result Image

Solution

Add <ng-content></ng-content>.

Example:

<div class="border-radius" nz-row [nzGutter]="5">
    <ng-content></ng-content>
</div>

Leave a Reply

(*) Required, Your email will not be published