New line in grid column data table angular

Question

I have a grid and having a column value like below :

Column "DiskStatus"

"Mr c< br > Blue has < br >a blue house and< br > a blue car"

I am trying to replace < br > with '/n' but it is not giving new line (see code below)

this.resultData.forEach(x=> x.DiskStatus= x.DiskStatus.replace(//mg,'\n'));

How I get a newline in the grid cell?

  <table id="groups" class="table table-bordered table-hover dataTable" [mfData]="resultData" #mf="mfDataTable" [mfRowsOnPage]="rowsOnPage"
                            [(mfSortBy)]="sortBy" [(mfSortOrder)]="sortOrder">
                          <thead>
                          <tr role="row">
                            <th>  <mfDefaultSorter by="HostName">Host Name</mfDefaultSorter></th>                       
                            <th><mfDefaultSorter by="CPUStatus">CPU Status</mfDefaultSorter></th>                      
                            <th><mfDefaultSorter by="DiskStatus">Disk Status</mfDefaultSorter></th>


                          </tr>
                          </thead>
                          <tbody *ngIf="resultData.length>0">
                          <tr *ngFor="let result  of mf.data | filter:filter; let i = index">
                            <td>{{result.HostName}}</td>
                            <td>{{result.CPUStatus}}</td>
                            <td>{{result.DiskStatus}}</td>
                          </tr>
                        </tbody>
                        <tr *ngIf="resultData.length <=0"><td colspan="10"> No Data Found</td></tr>
                        <tfoot>
                            <tr>
                                <td colspan="8">
                                    <mfBootstrapPaginator></mfBootstrapPaginator>
                                </td>
                            </tr>
                            </tfoot>
                        </table>

Answer 1

Try with white-space: pre; /* o pre-wrap o pre-line */ on the styles for <td>