Angular 7 - multiline strings on tooltip

Question

I have created multi line string using Template strings.

toolTip = `
      ${Test}  : ${number}
      ${Test}  : ${number}
      ${Test}  : ${number}
      ${Test}  : ${number}
      ${Test}  : ${number}}`;

This multi line string I'm showing on tooltip of button , however, extra spaces are getting added from the second line e.g I'm getting output like below

Test string : 123
  Test string2 : 234
  Test string3 : 234

Is there any way to make them aligned properly?

user_13258211 · Answer

That's because theres a bunch of random spaces in your string

Try

toolTip =`${'string'}  : ${123}
${'string'}  : ${123}
${'string'}  : ${123}
${'string'}  : ${123}
${'string'}  : ${123}`;

https://stackblitz.com/edit/angular-ivy-9szvet?file=src/app/app.component.ts

Angular 7 - multiline strings on tooltip

1 Answers