Show some text if missing emoji in HTML

Question

Is there a way in HTML or Angular to show some text if an emoji is missing? For instance, the thinking face emoji is missing in Windows 8, so I was hoping to show some alternative text if possible.

The emoji code is 🤔

My HTML is simple:

<div ng-switch-when="folder"
     ng-bind-html="Some text &#x1f914;">
</div>

Possible duplicate of [Detect browser character support in javascript?](http://stackoverflow.com/questions/4635683/detect-browser-character-support-in-javascript) — Heretic Monkey, Mar 10 '17 at 23:28
Hello domdom - Unfortunately, I do not have a solution. We just decided to remove the emoji for now! — AshD, Apr 04 '17 at 02:25

domsson · Answer 1 · 2019-12-17T08:16:20.757

I would recommend to use @font-face to import a font that you know contains the required unicode characters. Then, you can either use that font for all of the affected paragraphs, or just for the "emojis" by using the unicode-range descriptor.

Example:

@font-face {
  font-family: 'Someemojifont';
  src: url('some-emoji-font.otf');
  unicode-range: U+1F914; /* thinking face */
}

I understand that this isn't an exact answer to the question at hand, but it might still be a valid solution to the problem that motivated the question.

Show some text if missing emoji in HTML

1 Answers1