How to pass array of HTML elements or string to Angular component?

534 views Asked by At

Usual caveat: new to Angular, but lots of React experience.

I'd like to be able to pass an array of HTML elements to a component via the @Input() decorator. Specifically, I'm building a button group component, and the "body" of each button could theoretically be either text or an icon. So from the parent, I would want to do something like this:

<app-button-group [options]="[<i class='fa fa-arrow'></i>,<i class='fa fa-arrow-down'></i>,<i class='fa fa-arrow-up'></i>]"></app-button-group>

...but I'd also like this same component to be able to accept this input:

<app-button-group [options]="['one','two','three]"></app-button-group>

In React, this is a fairly simple matter, and even an encouraged pattern. I can't see how to do this in Angular. Is this a legit pattern, or do I need to figure out another way to do this?

Thanks in advance!

0

There are 0 answers