将十进制参考字符串转换为十进制以显示带 html 的表情符号

Question

该项目是使用 Angular 和 TypeScript 构建的。 HTML的片段是这样的，

<span>&#9748;</span>

在 span 中有一个小数参考，在渲染时它显示为这样的表情符号： ☔

现在我想用returns一个小数的函数替换小数代码☔，这样span就可以根据输入显示不同的emoji了。 Return类型是字符串，我想把它转换成unicode的东西。函数如下：

function getEmojiCode(desc: string): any {
    desc = desc.toLowerCase();
    switch (desc) {
        case 'rain': { return '&#9748;'; }
        case 'clear': { return '&#9731;'; }
        case 'clouds': { return '&#9729;'; }
        default: { return '&#9731;'; }
    }
}

然后我把函数放在HTML

<span>{{getEmojiCode(res.desc)}}</span>

在呈现的 HTML 中，在 span 的位置，它将字符串 ☃ 显示为文本，而不是表情符号。如何将字符串转换为十进制代码并让它在跨度内显示表情符号？

Answer 1

实际上函数返回的值是作为字符串添加的。我不知道你使用的是什么框架，但在 angular 中，你会做这样的事情。

<span [innerHTML]="getEmojiCode(res.desc)"≥ </span>

如果您使用的是其他框架，请将函数返回的字符串作为 innerHTML 添加到 span...

Answer 2

你也可以这样做：

<span>{{String.fromCodePoint(Number(getEmojiCode(res.desc).slice(2,-1)))}}</span>

代码片段：

console.log(String.fromCodePoint('&#9748;'.slice(2,-1)))

将十进制参考字符串转换为十进制以显示带 html 的表情符号

Convert decimal reference string to decimal to show emoji with html

html

decimal

emoji

typescript