Quantcast
Channel: Active questions tagged html - Stack Overflow
Viewing all articles
Browse latest Browse all 73964

Angular Tooltip does not recognize '\r' or '\n' characters

$
0
0

So to outline the use case: From my back-end service i receive a list of objects which I break apart using ngFor and display using . I attach a toolTip to this card to show a info about the item. The info for each item is a list of elements. For the tooltip I send the list to a function and join the items of the list with '\r\n' characters however the tooltip doesn't read the characters at all and just shows a contiguous string in the tooltip

<div *ngFor="let item of itemList; ">
 <mat-card matTooltip="{{getDesc(item)}}">
    <span class="card-title" style="font-size: 12px">
      {{ item.itemName }}
    </span>
 </mat-card>
</div>

The toolTip description function:

getDesc(item){
  let itemDesc: any;
  if(item.itemDescList !== null)
    itemDesc = item.itemDescList.join('\r\n')
  return itemDesc
}

how can I introduce those newlines in the tooltip?

example array: [ 'desc 1 : some text', 'desc 2: some text', ...] these need to be shown on new lines in the tooltip


Viewing all articles
Browse latest Browse all 73964

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>