Display entity reference in Angular binding

Question

I am writing a pipe that displays infinity (∞) symbol when the input value is larger than a trigger point:

transform(value: unknown, ...args: unknown[]): unknown {
    if (typeof value == "number") {
        if (value == 10000000) {
            return "∞";
        }
    }
    return value;
}

The problem is that the infinity symbol is displayed ∞ instead of the actual symbol. What is the correct way to display entity reference (or character) in an angular binding?

Answer 1

use ascii char directy such as:

export class InfPipe implements PipeTransform {
  transform(value: unknown, ...args: unknown[]): unknown {
    if (typeof value == "number") {
      if (value == 10000000) {
        return "∞";
      }
    }
    return value;
  }
}

if you want directly copy from code then there is stackbitz example: https://stackblitz.com/edit/infexamplefahim?file=src/app/Infpipe.ts