Add table cells from component in angular 4

Question

I have the following HTML table:

<table>
  <tr>
    <th>Firstname</th>
    <th>Lastname</th> 
    <th>Data 1</th>
    <th>Data 2</th>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
    <td>Component data 1</td>
    <td>Component data 2</td>
  </tr>
</table>

I want to add a component inside of the second that will contain the last 2 < td > tags so it will look something like this:

<table>
  <tr>
    <th>Firstname</th>
    <th>Lastname</th> 
    <th>Data 1</th>
    <th>Data 2</th>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td> 
    <some-data></some-data>
  </tr>
</table>

The template of the some-data component will include the 2 < td > tags that the table needs, but doing this will break the table layout and will not look as it should.

Is there a way to achieve this?

Answer 1

what i understand from your question is you want to show dynamic data based on some input or database, you'll need PHP if only need to show input. database like mysql if want to fetch data.